Hello guys, how can i adjust in my small images some space in between?
Here is the URL and password:
nikthe
A Shopify store owner needs help adding spacing between small product images on their product page. The issue involves thumbnail images appearing too close together without gaps.
Three solutions were proposed:
Remove existing CSS: Delete conflicting CSS code from the theme file that may be preventing proper spacing.
Add custom CSS to theme.liquid: Insert CSS code in the theme.liquid file before the closing body tag to adjust image spacing.
Modify component-slider.css: Add specific CSS targeting the mobile slider component:
.slider.slider--mobile {
column-gap: 3rem !important;
row-gap: unset !important;
}
This solution includes a visual result showing the spacing applied.
All responses provide step-by-step navigation through Shopify’s theme editor. The discussion remains open with no confirmed resolution from the original poster yet.
Hello guys, how can i adjust in my small images some space in between?
Here is the URL and password:
nikthe
Hi
Remove the below css from your theme file . This will solve your issue.

Thanks!
Go to online store ----> themes ----> go to three Dots ----> edit code ---->find theme.liquid files ----> place the code ---->
before the body ----->
if this code work please do not forget to like and mark it solution
Hello @NikosBat
Go to online store ----> themes ----> actions ----> edit code ----> assets ----> component-slider.css
add this code at the end of the file and save.
.slider.slider--mobile {
column-gap: 3rem !important;
row-gap: unset !important;
}
result
If this was helpful, hit the like button and accept the solution.
Thanks