:first-child fails when an element of a different class is dynamically inserted above
- by koko
So, I've encountered a situation where inserting an element of a different class/id breaks all css-rules on that :first-child.
<div id="nav">
<div class="nSub">abcdef</div>
<div class="nSub">abcdef</div>
<div class="nSub">abcdef</div>
<div class="nSub">abcdef</div>
<div class="nSub">abcdef</div>
</div>
.nSub:first-child { margin-top:15px; -moz-border-radius-topleft:5px; /* ... */ }
.nSub { background:#666; /* ... */ }
.nSub:last-child { -moz-border-radius-bottomleft:5px; /* ... */ }
As soon as I insert an element of another class/id above, like this:
$('nav').insert({top:'<div id="newWF"></div>'});
all declarations for .nSub:first-child are being ignored in both FF 3.6 and Safari 4.