Site
Management
Index
Contributed by SSI-Developer.net
"As you should be aware certain styles will not work in old browsers such as the version 4 browsers. If you want to use CSS but maintain support for these old browsers it is recommended that you create a style sheet especially for these old browsers."
Print 
Email
Separate style sheet for old browsers
As you should be aware certain styles will not work in old browsers such as
the version 4 browsers. If you want to use CSS but maintain support for these
old browsers it is recommended that you create a style sheet especially for
these old browsers.
This guide just shows you the most common way of including two style sheets so
that old browsers will read from one style sheet which newer more compliant
browsers will overwrite with your more advanced style sheet.
The Code
The following code shows how you link to both required stylesheets:
<link rel="stylesheet" type="text/css" href="simple_styles.css">
<style type="text/css">
@import url(advanced_styles.css);
</style>
Your styles for older browsers should be contained in simple_styles.css. Old browsers understand the style sheet link <link rel=""... but they do not understand the @import rule so simply ignore that.
Newer browsers which understand the @import rule will read these styles and over-ride the simpler styles. You have to be clever about it and only over-ride those styles which you need to.
Simple styles
To write your simple style sheet you should:
* avoid a:hover
* avoid display:block
* use negative margin-top for headings (H1-H6)
* avoid background shorthand
* border shorthand works in NN4+, avoid other definitions
* element heights
* list styles
To get an accurate reference you really need to consult a compliance reference chart such as ones you will find here:
* http://www.westciv.com/style_master/academy/browser_support/
* http://www.w3schools.com/css/css_reference.asp