Sent by Michael Geary on 19 June 2006 07:07
> > > I'm just wondering how well is the multi-class feature (i.e.
> > > class="style1 style2 style3") supported in various browsers.
> > > Also, is there any significant difference between browsers in
> > > terms of how the order of class names affects the
> > > specificity/style precedence?
> Actually, IE has issues with multiple selectors. Not that it
> doesn't work, just that there are caveats (that have bitten
> me several times).
>
> Refer to the wiki for details:
> http://css-discuss.incutio.com/?page=MultipleClasses
The wiki doesn't say there is any issue with class="one two three" in IE. I
use that extensively and haven't seen any problems with any browsers as far
back as IE 5.0. The problem is when you try to use a CSS selector like
..one.two {}, which doesn't work at all in IE. But you can certainly use .one
{} or .two {} to match the class="one two three".
To achieve an "and" effect like .one.two {} gives and have it work in any
reasonably modern browser, I use nested elements with individual classnames.
For example, if I want to do the equivalent of:
<span class="one two">
test
</span>
.one.two {}
I use instead:
<span class="one">
<span class="two">
test
</span>
</span>
.one .two {}
It's somewhat ugly but effective. Note that this still works fine if there
are multiple classnames, e.g.
<span class="one three">
<span class="two four">
test
</span>
</span>
.one .two {} /* identical results to previous example */
But this may or may not relate to the OP's question...
-Mike
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
