Alex Buddy Alex Buddy - 7 months ago 9
HTML Question

How to get rid of horizontal scroll of a page

I'm making a landing and I've this set of rules applied for the body and html elements:

html {
margin: 0px;
height: 100%;
width: 100%;
}

body {
margin: 0px;
min-height: 100%;
width: 100%;
}


Also, everything is viewported:

<meta name="viewport" content="width=device-width, initial-scale=1">


And on the picture, below, you can see main blocks of the page, they all have width 100%

the pics

However, nothing of what I mentioned really helped and the blocks of the page despite they all have 100% width, have different size and, there's a horizontal scrollbar too.

What should I do to get rid of the scrollbar and to make all the blocks be the size of a current viewport?

Answer

try put

overflow-x: hidden;
overflow-y: scroll;

at the body {

Comments