CSS selectors — combinators: E F, E > F, E + F, E ~ F

Code used

.testgrid p {background:#f2f2f2; color:#11111d}
h1 + .testgrid {background:lime; color: #fff}
#t2 h5 ~ p {color:yellow; background: blue;}
#t2 > h5 {font-size:3em; color:#090; background: #cfc;}

Notes

1. IE 5.0 Windows seemingly applies some of the rules tested here. This a bug in the browser: when there is white-space surrounding the combinators (>, +, ~), IE 5 ignores whole parts of the selector and only uses the part following the combinator sign (i.e. in h1 + .testgrid, IE 5.0 selects all elements with the class .testgrid). Omiting the white-space corrects this; see the following test document.

back to introduction

Last modified: September 10 2009 03:08:56 GMT.

• A [ La Chatte Noire ] development area
• [ contact ]
• [ sectionindex ]
• [ Empty Spaces ]