Tuesday, October 14, 2008

Font sizes in CSS

Just now I wanted to adjust the font sizes in Django's built-in admin interface so I had a look at the CSS. In the global stylesheet, as expected, there's a font-size defined on the body tag. First thing to note - it's a fixed pixel size rather than a relative size which isn't ideal (for accessibility it's better to make this relative to the user's system/browser default). Anyway, when I changed it, none of the fonts actually changed size, because there are seperate (fixed-pixel) font sizes defined for each type of element.

This is a common error and one that winds me up. I just want to change the font size in one place, not search through a load of files looking for all the font-size properties. And when they've all been defined as fixed-pixel sizes it's worse because then I've got to try to work out by how many pixels each size should be adjusted to keep everything in proportion.

If all the font-sizes were set relative to the body font-size (using % or em values), then I could simply adjust the body font-size and everything else would resize accordingly - a 10 second job instead of 10 minutes!

No comments: