Sashidhar Kokku's blog

Let go of the pixel

Rather than using exact pixel sizes while defining font-size in your CSS files, use CSS compliant sizes like small, medium,large. Remember that you should let your user change the size if he/she wants to, and the user has the browser (and nothing else) at his/her disposal to change the size of the font.

Its generally a wise idea to set your body tag to have a base font-size.

 1: body
 2: {
 3: font-size:small;
 4: }

With the setting as above, all your body will take the default size as small, and will be compliant with the browser. Obviously, no one wants every text in the webpage to use small as the default size, one has headings, hyperlinks, and other user-defined tags.

For other tags like <h1> where you would want to have a bigger font, use a percentage. This will use the set base font size (whatever the user sets or u set), and work with it.

 1: h1{
 2: font-size : 150%;
 3: }
 4:  

The advantage of the percentage approach would be that, should you decide to change the font size from small to medium, you would have to change it at one place, and all the tags would have the modified behaviour applied to them automatically, thereby reducing your work to change the font-size for all tags

Leave a Comment

(required) 

(required) 

(optional)

(required)