Change background colour of Blog post element using :nth-child(n)

Hi,

yes that link is an example where there are 4 .av_one_third blocks and the 4th is the same colour as the first despite me adding:

<style>
.homepage-post-block .av_one_third img {width: 300px; }
.homepage-post-block .av_one_third {width: 300px; float: left; margin:10px;}
.homepage-post-block .av_one_third:nth-child(1) {background: #C9D1AD;}
.homepage-post-block .av_one_third:nth-child(2) {background: #99B0B0;}
.homepage-post-block .av_one_third:nth-child(3) {background: #99CFCC;}
.homepage-post-block .av_one_third:nth-child(4) {background: #000;}
.homepage-post-block .av_one_third:nth-child(5) {background: #C2D966;}
.homepage-post-block .av_one_third:nth-child(6) {background: #C9D1AD;}
</style>

The original full page is at: http://tweeddale.digitalessence.net/

Thanks.

Hi Rikard,

I was sure that all of these 1/3 elements were all children of the parent div but obviously not.

I’ve managed to implement it by using the slide-loop-{$post_loop_count} on line 443 of \enfold\config-templatebuilder\avia-shortcodes\postslider\postslider.php as this is the post count number.

this was I can target each specific 1/3 as required:

eg:

.homepage-post-block .slide-loop-1 {outline:1px solid blue;}
.homepage-post-block .slide-loop-4 {outline:1px solid red;}

Thanks for your help and hopefully if anyone else is looking to do this, this code will help them.