What I learned about nth-child selectors

This content originally appeared on Posts on LINQ to Fail and was authored by Posts on LINQ to Fail

Today I learned an interesting fact about how the nth-child CSS selector works and it was different to what I expected and what seems to make sense. I had the following HTML snippet: <div class="input-group"> <div class="legacy"> <div class="input-subgroup"> <input name="itemId" id="Type0" type="radio" checked="checked" value="1"> <label for="Type0">Single</label> </div> <div class="input-subgroup"> <input name="itemId" id="Type1" type="radio" value="2"> <label for="Type1">Couple</label> </div> <div class="input-subgroup"> <input name="itemId" id="Type2" type="radio" value="3"> <label for="Type2">Family</label> </div> </div> <div class="new"> <div class="input-subgroup"> <input name="somethingElse" id="somethingElse" type="text" maxlength="2" placeholder="Enter" value=""> </div> <div class="input-subgroup"> <input name="somethingElse2" id="somethingElse2" type="text" maxlength="2" placeholder="Enter" value=""> </div> </div> </div> And I wanted to find the input[type="radio"] at a particular position in the DOM.

This content originally appeared on Posts on LINQ to Fail and was authored by Posts on LINQ to Fail