[Resolved] How to Adjust WordPress Gallery Margin Padding?

[bluebit]

The wordpress gallery I think adds top and bottom margin padding between the gallery images and the top and bottom blog post text, how can I reduce that padding?

[David]

Hi there,

do you want to remove spacing (gutters) between images

or the spacing above and below

or both ?

[bluebit]

just the spacing above and below, I just want to decrease it by 1px on the top and bottom

[David]

Ok so to cover the bases:

1. The space above the gallery ie. between the line of text and the gallery is actually the bottom margin on the paragraph. You can reduce the globally in Customizer > Typograpghy > Body

2. The space below the gallery this CSS:

.site-main .gallery {
    margin-bottom: 25px;
}

3. Spacing around each image:

.gallery-item .gallery-icon {
    padding: 5px 5px;
}

The first 5px is the value for the top and bottom, and the other 5px is for the left and right.

[bluebit]

Ok, I did:

.site-main .gallery {
margin-bottom: 10px;
}

For the bottom, and that’s worked.

Also, I also tried this for the top:

.site-main .gallery {
margin-top: 10px;
}

But the this top code doesn’t work.

[bluebit]

I think its the gallery doing it, let me change it real quick.

[bluebit]

yep, I think I got it to work with this code:

.gallery-item .gallery-icon {
padding: 0px 5px 10px 5px;
}

Thank You

[David]

Glad to hear that 🙂

[Author]

Posts