Issue
I would like to know the nth-child()
value of this:
1 2 3 4 5 6 7 8 9 10
I have searched in many references like :nth Tester, Mastering the :nth-child but couldn't find the combination I need.
I have also checked my combination on this CSS3 :nth-child Calculator, it shows the combination like this:
:nth-child(n+3):nth-child(-n+5):nth-child(n+8):nth-child(-n+10):nth-child(n+13)
Could anybody help me out to achieve this?
Solution
web-tiki answered good, however, you can achieve it even shorter, using :not()
:
li:not(:nth-child(5n+1)):not(:nth-child(5n+2)){
background:gold;
border:1px solid green;
}
<ol>
<li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li>
<li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li>
<li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li>
<li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li>
</ol>
Answered By - Vucko
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.