Curious if I did miss something or it is really not possible select next label
for the following html chunk:
<div class="col-md-1">
<input type="radio" name="name" value="alice" id="name-alice">
</div>
<label for="name-alice">Alice</label>
<div class="col-md-1">
<input type="radio" name="name" value="bob" id="name-bob">
</div>
<label for="name-bob">Bob</label>
I'd like to select label for checked input, something like
input:checked + label {
background-color: red;
}
The +
CSS selector obviously does not work here. Any idea how to get work around this ?
rationale: Generally it may be considered a "parent selector issue", but input & label elements are specific as being paired with for
and id
attributes and was unclear if there is some counterpart in CSS.