CSS nth-child for a number of elements

I'm a little new to using nth-child (), so any help would be greatly appreciated. I am trying to use it in my css file and not directly in html. Below is my code - I want to highlight the first four elements that are populated in this list.

        <div class="icdcode-selector row-fluid " icdcode="@icd.ICDCode" orderID="@x" icdID="@icd.ID">
            <div class="span2 icdcode-sortable-handle">
                <div class="row-fluid">
                    <div class="span6">
                        <i class="icon-align-justify"></i>
                    </div>
                    <div class="span6">
                        <span class="icd-name">@icd.ICDCode</span>
                    </div>
                </div>
            </div>
            <div class="span9">
                @Html.TextAreaFor(m => icd.UserText, new { @class = "span11", id = "icd_" + Model.Encounter.DictationID.ToString() + "_" + icd.ICDCode.Replace('.', '-'), icd = icd.ICDCode })
            </div>
            <div class="span1">
                <a href="#" class="btn btn-mini icd-remove"><i class="icon-remove"></i></a>
            </div>
        </div>

I am trying to use a class like this: .primary-billing .div:nth-child(-n+4)but it is not working properly.

Please, help.

+5
source share
2 answers

You just need to change the .div to a div (this is an element, not a class).

See here: http://jsfiddle.net/sQCCA/

+6
source

The best guide you might need to understand nth-child is this website: http://nthmaster.com/

+7
source

All Articles