How do I add padding between images in a slider gallery?

I found something like this in another answer and it works:

.sqs-gallery-design-strip img { margin-right: 2px; }

Multiple ways to do this, but heres a simple way.

.sqs-gallery-design-strip-slide .sqs-wrapper img:not(:last-child) {
    padding-right: 10px; 
}

The answers here work to add space between the images. But I’ve found that when you click the ’Next’ button, the position that the next image slides to is offset by the same amount of pixels you’ve added to the margin. So if you’d like a lot of space between images (lets say 40px), your gallery starts to look out-of-whack by the second or third image.

Has anybody come across a solve for this? Whatever function the ’Next’ button runs on seems to account for the width of each image, but not the extra margin width you’ve added. Is there some way to force it to account for the extra pixels?

bshoop's worked for me... thanks.

Nick Scola's worked too but only after I removed the "-slide" that comes after "strip" like this:.sqs-gallery-design-strip .sqs-wrapper img:not(:last-child) { padding-right: 15px; }

Hey guys, I have never done any coding, but want to add the padding on my carousel gallery block. Where do I insert this code?

Thanks, Nick, but that didn't work. I'm using hudson. does that matter?

I'm not sure if it does since I use it on multiple sites and it works like a charm. But found one of the solutions.

I'm looking for a solution to the same problem

Is there a solution to this yet? I'm having the same problem.

Me too. :(

@Nick Scola @bshoop

Where do we insert this code please?

Thank you.

I went to Design/Custom CSS and added this code into the box:

.sqs-gallery-design-strip .sqs-wrapper img:not(:last-child) {
    padding-right: 10px; 
}

You can then change the 10px to whatever suits.

Hope that helps!