I am trying to create stripped rows with "complex" children, but I'm having trouble figuring out how to do it. I am using bootstrap, although I'm not sure if that makes any difference!
This is what I have attempted so far:
https://jsfiddle.net/1w9tv4ce/2/
My goal is to make all test-01 green, followed by test-02 black, then test-03 green, and finally test-04 black.
.rows-search div:nth-child(even) {
background-color: #95CA44;
}
.rows-search div:nth-child(odd) {
background-color: black;
}
.search-light-grey {
color: darkgray;
}<div class="container search-light-grey">
<div class="rows-search">
<div id="1">
test-01
<div>
1
</div>
<div>
<div>
2a
</div>
<div>
2b
</div>
<div>
2c
</div>
</div>
</div>
<div id="2">test-02</div>
<div id="3">test-03</div>
<div id="4">test-04</div>
</div>
</div>Thank you for your help!