How can i reduce the width of my website on mobile

[okocha21]

I have an issue on mobile, the width of my website is not the same as my mobile screen. I can always scroll a bit to the right and it doesn't look good. 

I added a code that i saw on a discussion and it solved the problem, but it caused my header to stay at the top of my website, but not when i scrolled down. 

Is there a code i could use the solve these issues ? 

[steve_michael2]

Hi  @okocha21 , kindly provide your store URL please and if it is password protected, please share the password as well. Thanks

[okocha21]

Hi, it's wonnky.com

[EvinceDev]

Hello @okocha21 , Try this code add this in your css file - base.css, or style.css

body, html {
  overflow-x: hidden; /* Prevents horizontal scroll */
  width: 100%; /* Sets width to device width */
}

[okocha21]

Thanks, it does resolve the width issue, but it creates another issue with my header which doesn't sticks to the top of the screen as i scroll down, even though it is activated to always stay fixed at the top. 

I'll let the code like this for now, so you can see by yourself. 

[Kyle_liu]

Hi @okocha21  

try this

body, html {
  overflow-x: hidden; 
  width: 100%;
  position: relative;
}