WordPress Gallery Border

I’m wanting to add borders to gallery images. But in a chessboard effect so image 1, 3, 5, 7, 9… will be black and 2,4,6,8,10… will be white.

I’ve tried the following CSS and I’ve had no luck 🙁

Read More
#gallery-1:nth-child(odd) img {
    border: 3px solid #B8A8A8;
}
#gallery-1:nth-child(even) img {
    border: 3px solid #000000;
}

.attachment-thumbnail:nth-child(odd) {
    border: 3px solid #B8A8A8;
}
.attachment-thumbnail:nth-child(even) {
    border: 3px solid #000000;
}

Here is the HTML

<dl class="gallery-item">
            <dt class="gallery-icon portrait">
                <a href="http://something.co.uk/ducfs/?attachment_id=9"><img width="120" height="120" src="http://something.co.uk/ducfs/wp-content/uploads/2013/11/Events-1-IMG_4864-150x150.jpg" class="attachment-thumbnail" alt="Events 1 IMG_4864"></a>
            </dt></dl>

Any help would be very much appreciated. Thanks!

Related posts

Leave a Reply

1 comment

  1. Use this

    .gallery-item img:nth-child(odd){}
    .gallery-item img:nth-child(even){}
    

    instead of

    #gallery-1:nth-child(odd) img {
    border: 3px solid #B8A8A8;}
    #gallery-1:nth-child(even) img {
    border: 3px solid #000000;}
    

    I think, it may work.