Menu
I'm a bit new to using nth-child() so any help would be greatly appreciated. I'm trying to use it in my css file and not directly into the html. Below is my code - I want to highlight the first four items that populate into 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'm trying to use a class like this: .primary-billing .div:nth-child(-n+4), but it doesn't seem to work properly.
Please help.
583
Writing Complex :nth-child() Selectors It works exactly the same as :nth-child except that it starts from the end of the parent. For example, you can select the first three children of a parent by using the selector :nth-child(-n + 3) . You can use :nth-last-child(-n + 3) to select the last three.
The CSS child selector has two selectors separated by a > symbol. The first selector indicates the parent element. The second selector indicates the child element CSS will style.
The :nth-child selector allows you to select one or more elements based on their source order, according to a formula. It is defined in the CSS Selectors Level 3 spec as a “structural pseudo-class”, meaning it is used to style content based on its relationship with parent and sibling elements.
The best guide you can have to understand nth-child is this website: http://nthmaster.com/
69
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
