Different look of css style with IE6 IE7 and Firefox

Today more and more websites are created using CSS. It separates content from presentation by keeping all the appearance information in a separate .css file. So you can change for example all link colors from blue to red by modifying 1 value in that .css file. However all browsers display webpages slightly differently. As an example we can take a look at one css design from csszengarden.com . Notice that on IE7 and Firefox the design is the same but in IE6 it differs dramatically:

Firefox screenshot
IE7 screenshot
IE6 screenshot
This hapens because IE6 doesn't support all css features. If you take a look at the css code from this site you'll see code block only for Mozilla Safari and Opera.
Body[id=css-zen-garden] is an attribute selector which IE6 doesn't support.
You can check how this design looks on your computer's browser HERE.

No comments: