CSS: Is "p div.myclass" a valid selector? -
is p div.myclass
valid css selector? i'd select div.myclass when descendent of p.
<body> <div class="myclass">do not select</div> <p> <any>... <div class="myclass">select element set background & border <any>other stuff may here</any> </div> </any> </p> </div> <!-- added after question answered --> </body>
it's valid selector, yes; div
not valid kid of p
element. css valid, html you're applying selector invalid.
incidentally, apart nested div
within p
, you've got unclosed div
wrapping p
, followed </body>
tag. html doubly-invalid, tags must closed in reverse order in they're opened.
addenda, raised in comments (i wasn't going bother adding originally, instead planning focus on syntax of css), browser (certainly chromium 24/ubuntu 12.10) 'rescues' html when constructs dom, go this:
<p> <any>... <div class="myclass">select element set background & border <any>other stuff may here</any> </div> </any> </p>
to dom looks (again, in chromium 24/ubuntu 12.10):
<p> <any>...</any> </p> <div class="myclass">select element set background & border <any>other stuff may here</any> </div> <p></p>
js fiddle demo.
therefore if problem have, , reason you're asking question, css isn't selecting/styling element, reason because you're using invalid html, , browser's changing html while constructing (valid) dom, means selector no longer matches targeting.
this why html validity rules should followed, makes easier work (both today, , in future when you, or else has to, revisit).
oh, , finally, &
character should not used in html directly, should encoded in way, such &
, because &
character first character in html character-entity codes. so...you've created triply invalid html.
css css-selectors
No comments:
Post a Comment