Need help with selectors

Hi,

I have the code below, which is generated by some sort of js. What I’m wanting to do is to put some space - probably with a margin-top - over all of the pq-select-optgroup divs except the first one (i.e., the one that currently has Stef Smith, PHD). I’m not the best with selectors. Any help will be appreciated. Here’s a sample of the generated code:

<pre>
<div class="pq-select-menu">
<div class="pq-select-optgroup">Stef Smith, PHD (You)</div>
<label id="pq-option-17-0" class="pq-select-option-label ui-state-enable pq-state-hover">
<label id="pq-option-17-1" class="pq-select-option-label ui-state-enable"></label>
<label id="pq-option-17-2" class="pq-select-option-label ui-state-enable"></label>
<label id="pq-option-17-3" class="pq-select-option-label ui-state-enable"></label>
<label id="pq-option-17-4" class="pq-select-option-label ui-state-enable"></label>
<label id="pq-option-17-5" class="pq-select-option-label ui-state-enable"></label>
<label id="pq-option-17-6" class="pq-select-option-label ui-state-enable"></label>
<div class="pq-select-optgroup">Jean C Brown</div>
<label id="pq-option-17-7" class="pq-select-option-label ui-state-enable"></label>
<div class="pq-select-optgroup">Gus Green</div>
<label id="pq-option-17-8" class="pq-select-option-label ui-state-enable"></label>
</div>
</pre>

Hi,
You can give all divs a top margin and then remove it from their parent’s first child (the one that has Stef Smith)

E.g.:

.pq-select-optgroup{
    margin-top:1em;
}
.pq-select-optgroup:first-child{
    margin-top:0;
}

There are other ways too. :slight_smile:

Excellent, Erik_J. Thanks for your help. I KNEW there had to be a way. :slight_smile:

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.