Reducing space between image and title on product page

Highlighted
New Member
6 0 0

Hi!

This is how my product page currently looks: https://imgur.com/5Z7qCva

I want to reduce the space between the star rating and the product image to make it look exactly like this: https://imgur.com/4YV5wCO

How can I do this?

Thank you.

0 Likes
Highlighted

You would just need to check the margin on those elements (stars, image), and make a quick change to your css file. If you post a link to the page it should be pretty easy to get the answer here.

Theme and app development | Toronto, Canada | sizzlecentral.com
0 Likes
Highlighted
Highlighted
Highlighted

I see that you have 45px of padding on top of the stars. If you added this to the bottom of your stylesheet it would move the pictures and stars closer together:

.product-single__meta {

padding-top: 0;

}

That would also move the stars higher on the desktop view, but it just makes them level with the top of the product photo.

Theme and app development | Toronto, Canada | sizzlecentral.com
1 Like
Highlighted
New Member
8 0 0

I need help on my store I'm having a really weird spacing on my product page between the product title and the product images. There are no margins to edit and I am extremely confused where the code is even causing the space. It is extremely odd that it can only happens when it's on mobile.

 

Screenshot (16).pngScreenshot (17).png

0 Likes