Solved

How to remove spacing between product title and product images? (happens only on mobile)

zephwong
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

Accepted Solution (1)
diego_ezfy
Shopify Partner
2935 562 883

This is an accepted solution.

@zephwong 

Do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid and paste this at the bottom of the file:

 

@media (max-width: 767px){
    .slick-list{
        max-height: 180px;
    }
}

 



Please let me know whether it works.

Kind regards,
Diego

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

View solution in original post

Replies 6 (6)

dmwwebartisan
Shopify Partner
12280 2546 3694

Hey @zephwong,

Please provide a website URL. I will check and provide a solution here.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
zephwong
New Member
8 0 0

Here you go!

https://www.hanawebstore.com/products/dinosaur-hoodie

 

Im also running into another issue. For some reason my “add to cart” button is glitching in my mobile but when I preview it using my computer it works fine.

BA0E8DF2-25F1-49D2-A124-F7289EE7FDB3.png

image.jpg

 

dmwwebartisan
Shopify Partner
12280 2546 3694

Hey @zephwong,

Do you need to solve only add to cart button problem?

Let me know which device you're checking because this is not the case for me.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
zephwong
New Member
8 0 0

Nope I am trying to solve the spacing problem first and foremost. I think we can just put the add to cart button problem on hold for now. The spacing problem happens on all tablet and mobile devices. Link: https://www.hanawebstore.com/collections/frontpage/products/dinosaur-hoodieScreenshot (16).pngScreenshot (17).png

diego_ezfy
Shopify Partner
2935 562 883

This is an accepted solution.

@zephwong 

Do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid and paste this at the bottom of the file:

 

@media (max-width: 767px){
    .slick-list{
        max-height: 180px;
    }
}

 



Please let me know whether it works.

Kind regards,
Diego

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

zephwong
New Member
8 0 0

Sir you’re amazing thank you! I’m still running into another issue on mobile though. The “add to cart” button keeps getting cut off. It does not happen on my mobile preview on my desktop but when I use my iPhone to access the website it suddenly happens.

 

584F73C4-196E-43F8-9B42-17B40C42A52B.png