Consistent Text With CSS

By Harry
Basically what this does is "removes and neutralizes the inconsistent default styling of HTML elements, creating a level playing field across A-grade browsers and providing a sound foundation upon which you can explicitly declare your intentions."

Yahoo!'s UI Library offer a CSS reset which makes all elements in all browsers reset to zero. Thankfully Yahoo! have made the reset publicly available.

Consistent Text With CSS
After adding or linking to the css from Yahoo! you have a firm base to style elements from, and as I was taught earlier on today, this can improve cross-browser font styling, especially in IE.

By giving the body tag a font size of 62.5%:
body {font-size:62.5%;}

all subsequent elements can be styled like this:
h1 {font-size:2em;}

Now, due to resetting the CSS and giving the body a font-size of 62.5%, all em values are related to pixel values in that 2em = 20px, 1.5em = 15px and so on.

There you have consistent cross-browser text styling.

Post Tags:

Toon Creffield

I'm Toon Creffield - A Graphic Design and Marketing professional from Sheffield, UK