Hey, all! I wanted to share a CSS trick for improving readability on your themes.
The matter of readability/accessibility on themes is a bit controversial in the RP community. The problem is exacerbated by the fact that RPers will often have small font sizes coded in their themes, and on top of that, use HTML in their posts to make their font size small on the dashboard (e.g. <small></small>, <sub></sub>, <sup></sup>). The result is posts that, when viewed on the RPer’s blog, are super incredibly tiny!
The way to fix this is to include CSS that targets the small, subscript, and superscript HTML and forces them to display at your default font size. If your font size is already 10px or 11px, think of how small your font will display after you <small></small> it! But if we force the theme to display this text at the default size, some of the readability issues are resolved.
1. Find your default font size.
If you coded your theme yourself, you should already know this! It’s whatever you coded your post font to display at. If you’re using a premade theme, it might take a little more searching, but you might have a drop-down/fill-in option for font size on your Customize page, or you might have to take a look in the code itself. The property that you’re looking for is font-size! Once you have that…
2. Create a new CSS rule that targets small, subscript, and superscript.
The reason we’re targeting all of these is because RPers tend to use one, or even a combination, of this HTML to make their text smaller on the dashboard. Here is how a rule targeting this HTML would look:
(Because we separated the selectors with commas, we can combine them all into one rule!)
3. Add in your font size.
Now that you have your rule, you can add in the declaration that will change the font size! If our default font was, for example, 11px, this is how it would look:
small, sub, sup {
font-size: 11px;
}
That’s seriously all it takes! Now you’ve made your theme more readable and more easily accessible to your fellow RPers.
I hope this has been helpful! Feel free to drop by my ask if you have any questions or comments. nwn
annaxmalina
titsay
yousharknotpass
germansingergirl
theartofmadeline
romaincrisis
blakekathryn
baratheonpilled
