Hi, i'm not a developer or anything but I think I've found my own personal solution i'd like to share with you. Only because it took me hours of trial and error to find the right soultion.
Basically, from what I can tell. 7.1 is using a sort of "container" to hold the images in which it reels through the gallery. Probably changing things like padding might just be changing the container as opposed to the image size itself. With that being said, trail and error, I figured why not just change the .gallery-reel-item img as opposed to the src or even gallery. Anyways, basically resizing the inner image within gallery-reel-item.
Code found below to what I believe basically resized the inner image a bit to give your images more visual space in between them. If they end up to small then just enlarge the size of the gallery.
.gallery-reel-item img {
width: 100%; ///change percentage to a smaller value in order to resize
height: auto;
}
the height set to auto to allow for scaled transformation. Hopefully this helps.
Hello, I'm trying to figure out how to add spacing between images in my slideshow reel gallery on Squarespace 7.1.
Every option I've found so far cuts off a portion of the image, and when viewed on phones, the images are no longer centered. I don't need to add any padding on top or bottom, just between the images, but without cropping them. Anybody know how to do this? Thanks!
Adding space between images in Slideshow Reel gallery
in Code Blocks
Posted
Hi, i'm not a developer or anything but I think I've found my own personal solution i'd like to share with you. Only because it took me hours of trial and error to find the right soultion.
Basically, from what I can tell. 7.1 is using a sort of "container" to hold the images in which it reels through the gallery. Probably changing things like padding might just be changing the container as opposed to the image size itself. With that being said, trail and error, I figured why not just change the .gallery-reel-item img as opposed to the src or even gallery. Anyways, basically resizing the inner image within gallery-reel-item.
Code found below to what I believe basically resized the inner image a bit to give your images more visual space in between them. If they end up to small then just enlarge the size of the gallery.
.gallery-reel-item img { width: 100%; ///change percentage to a smaller value in order to resize height: auto; }
the height set to auto to allow for scaled transformation. Hopefully this helps.