All divs in my page are too wide for the viewport

Question

What can I do if that happens (what’s in the title)?
I can move the page horizontally to see a drop more content.

Answer 1

You can use the website to copy and paste your code in the HTML Editor. Save and share the link.
https://www.sololearn.com/compiler-playground

Answer 2

If you share your code, via code playground we can have a look and offer suggestions.

Answer 3

Eli Klein In case you are having trouble and want a simple solution, I very much recommend using Bootstrap and their containers. Saves a lot of headache when it comes to making things just the right size for the screens. It does a lot of the heavy lifting for you.

Answer 4

Can it be on a github repository? I built it locally

Answer 5

Eli Klein Use metatag: <meta name="viewport" content="width=device-width, initial-scale=1.0">

Limit element width: div {
max-width: 100%;
}

Overflow control: body {
overflow-x: auto;
}

Answer 6

Oh i fixed it already by using width: 100% and not 100vw.
The issue was that vw didnt take the scrollbar into consideration
Thanks all.

Answer 7

‎ ຸ That is great information, but what does it do? Why should we use that?