November 8, 2012 - 9 comments

How to remove the irritating grey border from WordPress Gallery Images

So you think the WordPress built in Gallery shortcode is actually pretty good, but you can't get rid of that irritating grey border around the images,  here's how:

.gallery a img { border: 0 !important; }

The importance of the being !important; No need for fancy filters, or plugins.  Just add the above code to your own stylesheet.  The !important function means that this style overrides any later css, like inline styling (that is not itself also "!important").

Update: if your images are not links, you can remove the "a" selector.

 

 

Published by: admin in Snippets

Comments

Lori Kelly
February 10, 2013 at 10:12 pm

THANK YOU! I’ve been looking for this for hours, finding all sorts of suggestions, but nothing worked until this one. Can’t even express how grateful I am.

Lucie winterson
April 14, 2013 at 9:06 pm

This issue has been driving me demented! I am a beginner with all of this but the text u suggest putting in, to eradicate the gallery image borders (that make my images look like place mats) . Sounds daft , but where do I put it? Thanks! Lucie uk

    Derry
    April 15, 2013 at 9:17 pm

    You need to put it in your theme stylesheet. How you do that will depend on your setup.

    Derry
    November 28, 2013 at 5:29 pm

    In your style.css file (or in the theme options CSS if you have one with your theme)

Matt Dunton
November 6, 2013 at 3:16 pm

Hi Derry, couldn’t find what line of CSS in the parent theme was adding the unwanted image border !important finally came through thank goodness! Ta

Madeleine
November 20, 2013 at 4:13 pm

You saved my life (the digital one) 🙂 thank you so much!

Sharon J
January 13, 2017 at 11:15 pm

Perfect answer. I really appreciate this, it was driving me nuts.

Leave a Reply