Top of product image is hidden on mobile version

Solved
Excursionist
34 0 3

Hi There, 

I've added my first product to my Shopify store and it views fine on the desktop site, on the mobile site however a small portion of my image is hidden by my header bar.  

Does anyone know the code to move the product image down slightly on the mobile version only please?  I have added screenshots below showing how the image looks when the page loads and how i would like the image to look (i've scrolled the screen down to enable me to view the image like this). 

Thank you in advance. 

IMG_7045.PNG

IMG_7046.PNG

 

0 Likes
Shopify Partner
3668 817 1009

@MandyLT 

Please share your website URL and password if any. I will check and provide a solution here.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Do you want drag-and-drop Advanced Shopify Page Builder to customize your pages? check here PageFly App
This will help you grow conversion rate and sales for your e-Commerce business.
0 Likes
Excursionist
34 0 3

Hi 

website URL is little-trip-design.shopify.com

Thanks. 

Mandy. 

0 Likes
Excursionist
34 0 3

0 Likes
Excursionist
34 0 3

Hi 

did you get a chance total a look at this for me? 

Regards, 

Mandy 

0 Likes
Shopify Partner
3668 817 1009

@MandyLT 

Sorry for the delay. I just checked your above given URL. It is not working. Can you please check and send me again?

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Do you want drag-and-drop Advanced Shopify Page Builder to customize your pages? check here PageFly App
This will help you grow conversion rate and sales for your e-Commerce business.
0 Likes
Excursionist
34 0 3

Hi, 

https://little-trip-design.myshopify.com sorry about that.  I missed the 'my' in front of Shopify.  Apologies for that.  Looking forward to hearing from you again. 

All the best,

Mandy. 

0 Likes
Shopify Partner
3668 817 1009

This is an accepted solution.

@MandyLT 

No worries. It worked!!!

Please add the following code at the bottom of your assets/theme.css file.

@media only screen and (max-width: 749px){
.template-product .main-content {   padding-top: 60px !important; }
}

 

Hope this works.

Thanks! 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Do you want drag-and-drop Advanced Shopify Page Builder to customize your pages? check here PageFly App
This will help you grow conversion rate and sales for your e-Commerce business.
Excursionist
34 0 3

That worked perfectly.  Thank you so much!!  Have a good weekend  Mandy