Help! how can i fix the horizontal scrolling on my website

Solved
Highlighted
New Member
1 0 0

Below is the link to my website, if you open the website on your phone, there is a horizontal scrolling to a white section. how can i remove that? Thanks

 

https://www.myhappybump.com/

0 Likes
Highlighted
Shopify Partner
482 86 120

Hi @arminzafari

 

sarhov is here...

 

The fastest, but maybe not best solution is the following.

Edit Code, Open theme.scss.liquid file.

Scroll at the very bottom of this file and past the following code there.

body{
  overflow-x: hidden;
}

This can be used as temp solution, but there is need dig deeper and find why and what causes this scroll, one of the elements goes out of its container and there is need to find it.

Author: Hovhannes Sargsyan (aka sarhov).
An individual web developer focused on Shopify development.
Need more help? Feel free to send me a direct message or drop an email shopify@sarhov.com

Website: https://sarhov.com  
Email: shopify@sarhov.com
Skype: @sarhov
Telegram: @sarhov
Try Shopify free for 14 days,
0 Likes
Highlighted
Shopify Expert
3449 541 813

This is an accepted solution.

That may stop some slide working that use horizontal scrolling due to body overflow hidden,

Follow this:

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

p#fbExpanderMoreButtonSection { width: auto !important;}

 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
1 Like
Highlighted
Shopify Partner
482 86 120

@Jasoliya 

That can't cause any slide issue, sliders use their own wrappers for overflow hidden.

And that it is not perfect, I have written this myself...

Author: Hovhannes Sargsyan (aka sarhov).
An individual web developer focused on Shopify development.
Need more help? Feel free to send me a direct message or drop an email shopify@sarhov.com

Website: https://sarhov.com  
Email: shopify@sarhov.com
Skype: @sarhov
Telegram: @sarhov
Try Shopify free for 14 days,
0 Likes
Highlighted
New Member
1 0 0

Hi, I had the same problem. 

I used this solution which actually worked for desktop, but NOT on mobile. 

 

body{  overflow-x: hidden;
}

This solution had no effect. 

p#fbExpanderMoreButtonSection { width: auto !important;}

Any ideas how to fix it for mobile?

0 Likes
Highlighted
Tourist
5 1 3

Hi,

#content-holder{overflow-x:hidden;}

This code worked on my theme. 

0 Likes