Browsers types and lists

At the risk of making sweeping statements, browsers generally come in three basic categories:

CSS supporting browsers

This category includes Internet Explorer 5+, Netscape 6+, Mozilla 1+, Opera 5+, Safari 1 and Firefox. While these browsers differ in their CSS rendering capabilities, they will all render the lists on this site in a reasonable manner. Further information is available at " The IE box model and Doctype modes".

Semi-CSS supporting browsers

This category includes Internet Explorer 4 and Netscape 4. These browsers will render the lists on this site very poorly, if at all. However, you can hide offending styles from these browsers and allow them to see unstyled or partially styled lists instead.

One method for hiding CSS from older browsers is to use @import. You can use two different style sheets for your CSS; one CSS file for general styles (for any browsers that support basic CSS) and another CSS file for advanced styles (for full CSS supporting browsers only). This second file is imported rather than linked. For example:

<style type="text/css" media="screen">@import url("advanced.css");</style>
<link rel="stylesheet" href="general.css" media="screen" />

Non-CSS supporting browsers

This category includes Internet Explorer 3 and below, Netscape 3 and below as well as a range of text only browsers like Lynx, some PDAs and web capable mobile phones. If you use semantic markup (as discussed in "Why use lists for site navigation?"), these browsers and devices will be able to access all content within your sites without problems. They will see your well-structured content, without some of the presentation.