A safe subset of CSS?

Question

Addressing all the browsers back to IE6 is quite challenging. Every browser supports different features of the specifications. Is there a guide on a safe subset of CSS which can be used across browsers (IE6,IE7,FF1,FF2,Safari,Opera)? That way I wouldn't have to test my style sheets in 6 different browsers after every small modification - and adjust to their irritating quirks.

Answer 1

Here is a valuable reference. http://www.quirksmode.org/css/contents.html

Also, for IE and select other browsers - conditional comments. http://msdn.microsoft.com/en-us/library/ms537512.aspx

I use them this way. I override any IE specifics.

<link rel="stylesheet" type="text/css" href="theme.css" />
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="theme-ie6.css" />
<![endif]-->

Answer 2

In my experience while some CSS attributes might be supported by all browsers they don't always behave the same. Even some of the most basic attributes, like margin/padding/float, can cause things to look different between IE and everything else.

Usually the overall site template is the most complex. The way I do things is once I get that template written, and the simple classes to be used by the actual content, test a few sample pages in all the browsers. Usually you won't throw any major wrenches in the system once you're just working on content (although I'll always do a paranoid check here and there).

Answer 3

Both links from Daniel and jleedev are valuable resources. Your best bet in many cases is to use a reset stylesheet (just one example) that will minimize the rendering differences between browsers.

Dean Edward's IE7 is a JavaScript include that will add many standard CSS functionality into IE6/7 (such as <abbr> and support for pseudo selectors).

I recommend developing for Firefox/Opera/W3 spec, then using conditional comments for IE6/7.

Answer 4

I have found a book called Pro CSS and HTML Design Patterns, which contains pre-tested snippets of reusable CSS. This is very close to what I actually needed.