- From: Keith Patton <kpatton@sandfield.co.nz>
 - Date: Tue, 14 Sep 2004 14:37:56 +1200
 - To: <www-style@w3.org>
 
Hi there, 
I am attempting to structure a css file using ID selectors for the page
architecture and then use class selectors to vary the style of these
areas on a contextual basis. 
The following works in every browser except IE 6 it seems (including IE5
and IE 5.5):
<style type="text/css">
	#content.aboutUs {color: blue;}
	#content.products {color: red;}
</style>
<div id="content" class="products">
Test Text
</div>
For some reason if you declare a combined id and class selector *within
the same style block or stylesheet* ie 6 will only listen to the one
that is declared first. Even if this selector is not present within the
html document!
Does anyone know why this is?
I have alternatives of couse, but this one is more mark up and is
uglier:
<div id="content">
	<div class="products">
	Test Text
	</div>
</div>
.... Or just using class selectors
<div class="content products">
	Test Text
</div>
The last one might have worked except div.content.products in IE applies
automatically to *anything* with products as class attribute, for
example:
<div class="products">test</div>
Div.somethingimadeup.products {color: red;}
Looking forward to your thoughts, 
Keith
Received on Tuesday, 14 September 2004 02:38:31 UTC