When using the attribute selector in combination with a descendant, styles are not being applied correctly.
You may also take a look at http://stackoverflow.com/questions/6655364/css-attribute-selector-descendant-gives-a-bug-in-webkit/ where this bug is being discussed.
Created attachment 100613 [details]
Patch with failing layout test
The jsfiddle as a layout test.
Expected result: lines are blue/green/green.
Safari Version 5.0.4 (6533.20.27) fails—lines are blue/blue/blue.
Chrome 14.0.803.0 (Official Build 90483) dev Mac OS WebKit 535.1 (trunk@89703) fails—lines are blue/blue/green.
WebKit nightly r90810 fails—lines are blue/blue/green.
Firefox 5.0 passes.
It is interesting to note how sensitive this is to whitespace in the element with the attribute, as discussed on the StackOverflow bug. For example, if the first div[foo="green"] does not have child whitespace, then both div[foo="green"] render correctly (regardless of whitespace in the second one.)
Just in case this will provide anything: I encountered a bug that seems to be related. I was made aware of this bug report when I posted a thread about the bug on SO:
It also contains a jsFiddle which demonstrates the behaviour, allthough it is much more complex than dadu's fiddle: