How to Remove Horizontal Scrolling on mobile site of my homepage

Store Design
1

This is my homepage: https://www.bbkingkong.com/

In the mobile view there is a horizontal scroll bar appearing as a grey line in the bottom.

I want to remove this. Please help me on this issue. I have used this code to remove horizontal scrolling on desktop view, but the scrolling still shows on mobile view.

body{
overflow-x: hidden;
}

Please help on this matter.

Thanks in advance.

image008.png
image008.png304×537 136 KB

2 
@media only screen and (max-width: 600px) {
  

}

Add this media query with the your code. Add inside code in the media query.

Thank you

3

Thanks for the reply, I have added the code in the theme.scss.liquid but it still shows the scroll.

musfiqr002_0-1629897729023.png
musfiqr002_0-1629897729023.png526×499 15.1 KB

4

Add overflow-x: hidden! important;

5 
@media only screen and (max-width: 749px) {
  
html,body
{
overflow-x:hidden! important;
}

}
6

Where do i put the code if I don’t ‘theme.scss.liquid’ (btw im using the dawn theme) thanks :slightly_smiling_face: