如何摆脱页面的水平滚动答案

【问题标题】：How to get rid of horizontal scroll of a page如何摆脱页面的水平滚动
【发布时间】：2016-08-17 19:17:58
【问题描述】：

我正在登陆，我已经为 body 和 html 元素应用了这组规则：

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

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

此外，一切都是视口的：

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

在下图中，你可以看到页面的主要块，它们的宽度都是 100%

但是，我提到的内容并没有真正起到帮助作用，尽管页面块都有 100% 的宽度、不同的大小，而且还有一个水平滚动条。

我应该怎么做才能摆脱滚动条并使所有块都成为当前视口的大小？

【问题讨论】：

【解决方案1】：

试一下

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

在身体上{

【讨论】：

【解决方案2】：

你不应该有水平滚动条。如果您有水平滚动条 - 其中一个元素会溢出主页。尝试找出导致问题的原因。如果您使用溢出 - 您不会纠正问题，而是将其覆盖。缩放页面时它会爆炸 - 内容不会居中。

【讨论】：

【解决方案3】：

从正文和 html 中删除 width: 100%;。

【讨论】：