Question

我想创建一个中间有黑框的页面，左边和右边有30px的填充。

以下代码适用于没有水平滚动的桌面浏览器，但在移动版Safari中，您可以向左和向右滚动。如何防止此水平滚动？

我尝试添加溢出：隐藏到正文，外部div和内部div，这似乎没有帮助。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>hello world</title>
</head>
<body style="margin:0;padding:0;">

<div style="padding:0 30px">
    <div style="background-color:#000;height: 50px;">

    </div>
</div>
</body>
</html>

Answer 1

好的，答案是用另一个div包装带有填充的div。

<body style="margin:0;padding:0;">
<div>
    <div style="padding:0 30px">
        <div style="background-color:#000;height: 50px;">

        </div>
    </div>
</div>
</body>

移动野生动物园的水平滚动

1 个答案: