css HTML不要让垂直滚动条创建水平滚动条[重复]

fivyi3re 于 2023-07-01 发布在其他

关注(0)|答案(3)|浏览(98)

此问题已在此处有答案：

CSS Units - What is the difference between vh/vw and %?（7个回答）
3年前关闭。
在我的HTML页面中，我有很多宽度：100vw占据整个页面的东西。有一个垂直滚动条，它会导致一个水平滚动条（因为垂直滚动条占用了20个像素）。
更大的问题是我的东西似乎偏离了中心。虽然只是轻微的，一旦你注意到它（这需要3秒钟的凝视），它不会消失，是非常令人沮丧的。我贴了一个超级小的浏览器窗口的截图。我也发布了代码。
Image

<!DOCTYPE html>
<html>

<head>
  <style>
    body {
      margin: 0;
    }
    
    div {
      width: 100vw;
      height: 60vh;
      margin: 0 0 1vh 0;
      background-color: #CCC;
      text-align: center;
    }
  </style>
</head>

<body>
  <div>A div tag</div>
  <div>A div tag</div>
</body>

</html>

文本偏离中心。我该怎么解决？

css

来源：https://stackoverflow.com/questions/57049880/html-dont-let-vertical-scrollbar-create-horizontal-scrollbar

3条答案

按热度按时间

hmae6n7t1#

将div更改为width：百分百？

body {
    margin: 0;
}

div {
    width: 100%;
    height: 60vh;
    margin: 0 0 1vh 0;
    background-color: #CCC;
    text-align: center;
}

<div>A div tag</div>
<div>A div tag</div>

赞(0）回复(0）举报 2023-07-01

0ve6wy6x2#

Div是块元素，你不需要定义任何宽度，直到你特别需要。
所以在你的情况下，只要删除宽度，你的问题就会解决。

body {
                margin: 0;
            }
            div {
                height: 60vh;
                margin: 0 0 1vh 0;
                background-color: #CCC;
                text-align: center;
            }

<!DOCTYPE html>
<html>
   
    <body>
        <div>A div tag</div>
        <div>A div tag</div>
    </body>
</html>

赞(0）回复(0）举报 2023-07-01

7kjnsjlb3#

要删除水平滚动条，请使用width: auto

赞(0）回复(0）举报 2023-07-01

我来回答

css HTML不要让垂直滚动条创建水平滚动条[重复]

3条答案

相关问题

热门标签

最新问答