Mobile Album design: Thumbnail Margins

Backlight Customization
#1

Hello,
I have defined 30px Margins between the album thumbnails: e.g. https://test.sven-michael.com/portfolio/portfolio/lifescapes-overview/
It displays beautifully on monitors, but on mobile displays with 640 or less width (e.g. iPhone X ) the margin between the photos is heavily reduced.
Do you have any idea how I can fix this?
Many thanks and Krgds
Sven M

#2

It looks like this css is controlling the mobile margin:

@media only screen and (max-width: 375px) {
  .gallery .item {
    margin: 3px;
  }
}

Try adding this rule to your custom css, just change the margin value to something that looks good to you on mobile.

If you don’t want the images to shrink, then use margin-top rather than margin

#3

Hello Rod,
many thanks!
I’ve tried it, but unfortunately the margin is not changing…
Any other idea?
Krgds
Sven M

#4

I don’t see the code in your custom css.
double check that you saved the file and uploaded it to the correct location

#5

I have added it there - it’s the same file with the scroll to top button styling … strange
I’ve added:

@media only screen and (max-width: 375px) {
.gallery .item {
margin-top: 30px;
}
}

#6

I see it now. And it’s working

#7

Yes, great - many thanks!!!