I have 2 types of labels, normal labels like the first line, and labels that contain a input field within them. What CSS rule can let me select all <label>
but exclude all labels that happen to contain <input>
within?
<label for="type">Some Label</label>
<label for="type">
<input type="checkbox" value="1" id="type">Some Label
</label>
The best way of doing this woult be adding different classes to them or at least to one of them.
CSS hasn't a parent selector, so you can't check for an element that contains other withour some javascript.
Some background:
CSS selector for "foo that contains bar"?
Is there a CSS parent selector?
CSS Parent/Ancestor Selector
Complex CSS selector for parent of active child
The "adjacent sibling" selector should work, IF you are looking for label+input pairs:
label+input
{
/* rules */
}
This would ignore your label-nested inputs, unless there happens to be an input after a label that has an input within it.
See Sitepoint's CSS reference: http://reference.sitepoint.com/css/adjacentsiblingselector
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With