CSS - Repeating DIV background colour

Hi all, I'm trying to get an alternating background colour for a list of div containers using the nth-child feature. However, when I apply it to the div, it applies it to every even div container, and every even div within the div container. I only need it to select every even div container. <rolltemplate class="sheet-rolltemplate-vaesen-table">     <div class="container">         <caption><h1>{{name}}</h1></caption>         <div class="arrow-container"><div class="arrow-right"></div></div>             <div class="list">             {{#allprops()}}                <div class="sheet-flex"><div class="key">{{key}}</div><div class="value">{{value}}</div></div>             {{/allprops()}}             </div>     </div> </rolltemplate> CSS: .sheet-rolltemplate-vaesen-table .sheet-list div:nth-child(even) {     background-color: #fff; }

On a call, but I believe the issue is you're specifying a div after the list class.  Try this: .sheet-rolltemplate-vaesen-table div.sheet-list:nth-child(even) { background-color: #fff; }

Thanks for the help. But now it's not catching any of the divs

Try .sheet-rolltemplate-vaesen-table .sheet-list div.sheet-flex:nth-of-type(even) {     background-color: #fff; }

That did it! Thank you for the help!

You're welcome