Sent by Eric A. Meyer on 2 April 2002 11:11
At 21:02 -0500 4/1/02, Elaine Nelson wrote:
>I'm sure I'm not the only person who'd look at this and say "sweeeet...."
>
>http://catcode.com/csstips/classes.html
>
>but a question of curiosity - anybody know any immediate pitfalls?
I know of one: I found when I tested this a year ago that IE5.x
will only address one value at a time, and that other browsers have
their problems as well. Consider this markup:
<div class="urgent warning test">yee ha</div>
In IE5.x you could safely write styles like so and have them match properly:
div.urgent {font-weight: bold;}
div.warning {color: red;}
div.test {background: cyan;}
You could not, however, properly do things like:
div.urgent.warning {font-style: italic;}
The problem was that Explorer was too "loose" about what class
selectors matched what class values. The above should only match
elements whose 'class' value contains both 'urgent' and 'warning' in
a space-separated list. Explorer instead matched elements whose
'class' value contained either value.
I don't know if IE6 fixed this or not, so I'd be interested to
hear. You can try out
<http://www.meyerweb.com/eric/css/tests/multiclass.html> to see what
browsers do. I'll put a reference screenshot in a bit, but in the
interim, please note: there should be NO red text on the page. If
there is, the browser you're testing has bugs in its support.
--
Eric A. Meyer (http://www.meyerweb.com/eric/), List Chaperone
"CSS is much too interesting and elegant to be not taken seriously."
-- Martina Kosloff (http://www.mako4css.com/)
