Tomás Dornas Perone Tomás Dornas Perone - 20 days ago 6
CSS Question

Really strange white gap on mobile devices

I know other people have already asked about this before on StackOverflow, but I have been trying to fix this problem for days already with no luck. My website looks great on the computer but when I test it on mobile, a really annoying white space shows up in the right side of the display.

I tried to...


  • Set overflow-x: hidden on the body;

  • Set overflow-x: hidden on the html (it affected the scroll);

  • Set width: 100%, on both body and html;

  • I tried removing the navbar, that was apparently overflowing the body, but that didn't solve my problem.



It's like there's a "ghost" lying in that white space, because I also removed all the "padding-left" and "margin-left" from all the elements. Nothing.

Does anyone have a clue?

Here is the link: tomasperone.esy.es.

Thank you.

Answer

As a quick fix - add 'overflow: hidden' to the 'container' class.

.container, .container-fluid:overflow: hidden;

Hope this helps!

Comments