Question

below is the select html code and I’m looking for the first option which is 15

<select>
<option value="15" selected="selected">15</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>

I have tried this below and I get all the selection 15,25,50,100

div#topPager.gridHeader div.pagerItemContainer select.pagesize option 

if I use the nth of type like this then I got the first selection.

div#topPager.gridHeader div.pagerItemContainer select.pagesize option:nth-of-type(1)

is there any other way of doing instead of using the nth-of-type?

Answer 1

More to the point and accurate:

#yourSpecificSelectors option[value="15"] {}

This is called an attribute selector, in this case it matches the option with value="15".

http://www.w3.org/TR/CSS2/selector.html#attribute-selectors