I am working on my Technical Documentation page. When I open it on mobile content is moved to the left, if I put overflow:hidden on body I am unable to see my content on mobile and unable to scroll body, can anyone help please? I am unable to find cause.
Here is my pen: https://codepen.io/amaranthaST/pen/VwLgvvv
Also any other comments are welcome
Thank you in advance!
I can’t reproduce your bug about content moving to the left. You have have changed the code since then.
About your question related to
overflow: hidden on
If you put
overflow: hidden on any element that contains overflowing content (including its children) it will hide the overflowing content. And since
body is basically the parent of all the elements in your HTML, it will stop the scrolling on your page.
Can you explain a bit more what you were trying to achieve by setting
Yes I have changed code. Also I found I have padding on one of my elements which was causing that page is shifted to the right and not overflow as I originally thought.
I had this problem on my other pen where I had to use overflow because I had horizontal scroll in page, but I found explanation for overflowing and overflow-x: hidden; resolved my issue. (https://codepen.io/amaranthaST/pen/dyoQzzg this pen)