When I change the font used on my wiki to Times New Roman, it seems tiny in comparison with Arial... what is the best way to increase the font size slightly throughout the whole wiki? Thanks. (First posted on Topic:Wilvjx2lnfh5ulyu but I guess it's better to ask here seeing as I'm using the Foreground skin rather than Vector.)
Topic on Skin talk:Foreground/Flow
I compromised and used Georgia in the end. It has serifs, which I want, but is about the same size as Arial so I won't need to adjust any CSS.
Why don't you want to use CSS ? With the /Mediawiki:Common.css pages (or /Mediawiki:Foreground.css for the skin only), it's very simple to change your site's font.
This was two years ago now, but from memory it was easy to change the font, but really hard to change the font size. I think this was because its hard coded into the Foreground CSS in dozens of places. And because Times New Roman just seems to be smaller at the same point size compared with Arial or Georgia. It wasn't any underlying philosophy of not wanting to use CSS: it was just that I hadn't found it as easy as I had hoped. I managed it in the end by fiddling with the rem font-size of various HTML elements (making some >1 and some <1).
Ha. I don't have any problems with MediaWiki:Common.css. You really should take up CSS... It allows you to modify almost anything in any way ;)
Don't forget to format in "em" and not in "px". And try !important if not working. It works for titles, body, buttons, etc.
Eg :
/* Formatage des titres */
h1
{
font-size: 1.875em !important;
font-weight: 500;
}
h2
{
font-size: 1.5em;
}
h3
{
font-size: 1.1em;
font-weight: 600;
}
h4
{
font-size: 1.1em;
}
Good for you. I used rem rather than em but took a similar approach.
P.S. What I had hoped for at the beginning was a way of adding one line of CSS to increase the font size site-wide to, let's say, 110%. It was a while ago now, but I think that worked for some elements and not others, which meant I had to target each element separately.
Ha ok. I get it. You can apply any attribute (font size, font family, background,...) to the whole page using the html operator (the page) * (all selectors) like this to Mediawiki:YourSkin.css :
html * {
font-size: 105% !important;
}
That said, using universal selector is not recommended. It may slow down the site, it may conflict with certain elements and values that are too high may "break" the page.