Chaining class selector

[GoogleCodeExporter]

If you try this in IE6:
.menu-item { color:black; }
.active.menu-item { color:red; }

you'll see that text in all the elements with the class "menu-item" is red,
not just in the ones that also have the "active" class, like it's supposed to.

The problem is that IE6 ignores all the classes within a chain, but the
last one.

So, if you'll have the following:

.item { ... }
.last.item { ... }
.first.item { ... }
.active.item { ... }
.last.active.item { ... }
.first.active.item { ... }

IE6 will only see the ".item" selector in each of these cases (as it's
always the last one) and will apply all the rules to all the ".item" elements.

If there would have been a selector like

.item.active { ... }

the rules specified would be applied to all the ".active", not only to the
".active" AND ".item" elements.

Original issue reported on code.google.com by ionut.bo...@gmail.com on 16 Jan 2009 at 7:43

• Merged into: #161

[GoogleCodeExporter]

Wait! The code above actually works!
I'll attach an archive with this problem reproduced!

Original comment by ionut.bo...@gmail.com on 16 Jan 2009 at 8:24

Attachments:

• test.zip

[GoogleCodeExporter]

This is probably related to issue #161.

I couldn't recreate your problem though. The supplied test.zip rendered 
correctly in 
IE6.

Original comment by dean.edw...@gmail.com on 11 Feb 2010 at 6:53

• Changed state: Duplicate

[GoogleCodeExporter]

I attached a screenshot with the difference between IE6 and FF for the files in 
that zip.

Somewhere in "assets/css/layout.css" there's the selector ".graph-tabs
.tab-selected.tab-left" which is treated by IE6 like it was ".graph-tabs 
.tab-left"

Original comment by ionut.bo...@gmail.com on 11 Feb 2010 at 9:34

Attachments:

• 2010-02-11_2313.png