Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Select odd elements except the first-child

I have div elements like this

<div id="container">
    <div id="content">
        <div class="arrow"></div>
    </div>
    <div id="content">
        <div class="arrow"></div>
    </div>
    <div id="content">
        <div class="arrow"></div>
    </div>
    <div id="content">
        <div class="arrow"></div>
    </div>
</div>

I want to select the first-child but I have a css like this

#container #content:nth-child(odd) .arrow {
    background: red;
}
#container #content:nth-child(even) .arrow {
    background: green;
}
#container #content:first-child .arrow {
    background: pink;
}

But then the first-child is color red because first child is an odd number.

I tried using this and I don't know if it's going to work and it didn't

#container #content:nth-child(odd):not(:first-child) .arrow {
    background: red;
}

But then, the first div's arrow is still red.

What am I doing wrong?

like image 241
Juvar Abrera Avatar asked May 23 '14 04:05

Juvar Abrera


Video Answer


1 Answers

:nth(odd) is just a shortcut for :nth(2n+1), if memory serves, so I'd think :nth(2n+3) might work.

like image 80
Ulrich Schwarz Avatar answered Sep 28 '22 07:09

Ulrich Schwarz