Gallery right margin overflow hidden

Could this be remedied with a hide-overflow of the last item css?

no.

try this (either in style.css of your child theme, or via the ‘Appearance – Custimize – Additional CSS’):

.gallery-item { margin-right: 4%; padding-right: 0; width: 48%;}
.gallery-item:nth-child( 2n ) { margin-right: 0; }
@media screen and (min-width: 30em) {
    .gallery-columns-3 .gallery-item { padding-right: 0; width: 32%; margin-right: 2%; }
    .gallery-columns-3 .gallery-item:nth-child( 3n ) { margin-right: 0; }
}

for the default 3-column gallery only.
this will ever so slightly change the spacing between the gallery images.

Hi. Thank you, that looks much better. Back to my other threads to make the columns display as a single column instead of 2 images, then 1 underneath in mobile view. Thanks again.

Hi. All sorted.

}
}
@media screen and (max-width: 30em) {

.gallery-columns-3 .gallery-item {
min-width: 100%;
}
}
fixed the image columns.
Happy days…

Hi Me again. I used the code Michael(@alchymyth) supplied which was fine, for only three columns but now I need to use 4, 5, and 6 columns. When I do they space unevenly. I have removed the previous css edit, obviously the gallery has reverted to showing the right margin on the last item. How would the code below be edited to include up to six items. I have removed the css below.

demo at https://www.nicallen.com/hbs/?page_id=132

.gallery-item { margin-right: 4%; padding-right: 0; width: 48%;}
.gallery-item:nth-child( 2n ) { margin-right: 0; }
@media screen and (min-width: 30em) {
.gallery-columns-3 .gallery-item { padding-right: 0; width: 32%; margin-right: 2%; }
.gallery-columns-3 .gallery-item:nth-child( 3n ) { margin-right: 0; }
}
@media screen and (max-width: 30em) {

.gallery-columns-3 .gallery-item {
min-width: 100%;
}
}

PS I am using a child theme which has the full width page fix applied.

Thanks Best wishes Nick.