在智能手机上查看时，我页面上有额外空间

Question

我希望my page无响应。它的宽度约为1000px。我希望它在我的智能手机上以整体显示，以便用户必须放大才能读取正常大小的字符。

然而，无论我做什么，在智能手机上查看时，我在主要内容的右侧总是有数百个像素。我试图将width: 1050px设置为＆＃34; wrap＆＃34;包含我整个页面的元素，结果相同。现在我的body标签设置为width: 1050px，结果相同。

我试过没有视口标签。然后我尝试了<meta name="viewport" content="width=1050, initial-scale=1">。

理想情况下，在智能手机上，我希望页面水平居中，每侧有30px的填充，不可能水平滚动。怎么做？

Answer 1

使用

body {
    overflow-x: hidden;
}

并将元标记更改为

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