Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS last-child if more than 4 elements

Tags:

html

css

jsFiddle - I'm trying to only get the last element to highlight ONLY if there is more than 4 containers within the wrapper. Is it possible to do this using css instead of JS

<div class="wrapper">
    <div class="container">Container #1</div>
    <div class="container">Container #2</div>
    <div class="container">Container #3</div>
    <div class="container">Container #4</div>
    <div class="container">Container #5</div>
</div>

.wrapper div:nth-child(n+4):last-child() {
   background-color: gold;
}
like image 506
ngplayground Avatar asked Dec 04 '22 05:12

ngplayground


1 Answers

Yes. You can achieve this. You are almost there just some small correction.

Fiddle: http://jsfiddle.net/kiranvarthi/q5parpxy/4/

.wrapper div:nth-child(n+5):last-child {
   background-color: gold;
}
like image 104
KiV Avatar answered Jan 02 '23 20:01

KiV