Or if neither of the sets of styles are unique, you can have: <div class="explorer mini">Mini</div> <div class="explorer full">Full</div>
.. I know this works but I'm not sure what the general opinion is. Are there any problems with it? I have used it when I have several floats with most of the same styling, but some floated left and some floated right .
Perfectly valid. I'd like to add a word of caution, though.
-------------- css-d WIKI http://css-discuss.incutio.com/?page=MultipleClasses
The problem with multiple classes in IE is that you have to avoid CSS multiple selectors with "common final matches" like
.explorer {background: gray; }
.mini { font-weight: normal;}
.full { font-weight: bold; }
.full.explorer {text-decoration:none; background: red;}
.mini.explorer {text-decoration:underline}<!-- modified --> <div class="mini explorer">Mini</div> <div class="full explorer">Full</div>
Valid, and sometimes useful with more alternatives than shown here, but breaks IE: Now both the divs get underlining /and/ red.
--------------
Another IE6 bug can be seen when multiple css/html files are combined.
#sidebar {background: maroon; }
#sidebar.head1 { color: white;} /* A */
#sidebar.head2 { color: blue;} /* B */
#sidebar.head1 {text-decoration: underline; } /* C */I think of two pages: both load the CSS file/files above. Both show this sidebar:
<div id="sidebar" class="head1">Lorem</div> <!-- <div id="sidebar" class="head2">ipsum</div> -->
(The html comment is here to show that the bug is /not/ related to using the same unique id for two divs at one page. Alternate the comments to see for testing, or just remove the comment.)
Did I really expect to get "Lorem" white + underlined and "ipsum" blue? --------------
I copy the rule A into C:
#sidebar {background: maroon; }
#sidebar.head2 { color: blue;} /* B */
#sidebar.head1 {text-decoration: underline; color: white;} /* C + A */The second page, "ipsum" text is blue ... finally, he, he.
But the first page, "Lorem" has ... no color, no underline? This is one of these frustrating moments.
I think, for matching id="sidebar" class="head1", IE searches at #sidebar.head2 at first and fails. Now it blocks: #sidebar.<anymatch> and will not be able to look further at #sidebar.head1
______________________
The bottom line for me is: I can use multiple classes/id+classes as I like it, and I like it, but I don't use multiple selector rules in IE. It just looks like as if they'd work in IE6, but they do not, imho.
Ingo
______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
