Let’slookattheNumber of Ticketsfieldagain.Itsmarkuplookslikethis:
<p>
<label for="quantity">Number of Tickets</label>
<span class="help">Limit 8</span>
<input type="number" value="1" name="quantity" id="quantity"
➥ step="1" min="1" max="8">
</p>Ourinputelementfollowsthelabelelement,butthereisaspanelementin
between.Sinceaspanelementsitsbetweeninputandlabel,theadjacentsibling
combinatorwillfailtoworkhere.Let’schangeouradjacentsiblingcombinatorto
ageneralsiblingcombinator:
01-selectors/general-sibling-combinator.html (excerpt)
label ~ input {
display: block;
}Nowallofourinputelementssitonaseparatelinefromtheirlabelelements,as
seeninFigure1.7.
Selectors 11