为什么'width：100vw' CSS规则会产生滚动条？

0md85ypi 于 2022-12-05 发布在其他

关注(0)|答案(2)|浏览(543)

我尝试有一个顶部横幅，匹配的屏幕大小。这个横幅包含标题+一个波SVG。
我得到了我想要的结果与这些CSS规则，SVG匹配良好的响应，除了一个滚动条导航几个像素（我尝试了许多其他的东西，包括百分比宽度）。

EDIT：我需要width:100vw规则，因为我希望此容器是全角的，而父元素不是全角的。

第一个
渲染：

有人有主意吗？谢谢！
为什么'width：100 vw' CSS规则会使滚动条出现？

css

来源：https://stackoverflow.com/questions/74679595/why-width-100vw-css-rule-causes-scrollbar

2条答案

按热度按时间

o2gm4chl1#

这是因为你有一个垂直滚动条。请参阅以下内容：https://sbx.webflow.io/100vw-scrollbars
使用width: 100%;代替（对我来说，使用你给出的html非常合适）。
下面是完整编辑的CSS：

.shape-divider {
    left: 50%;
    line-height: 0;
    margin-left: -50%;
    position: relative;
    width: 100%;
}
.shape-divider svg {
    display: block;
    height: 62px;
    margin-top: -1px;
    width: 100%;
}

赞(0）回复(0）举报 2022-12-05

twh00eeo2#

移除+ 1.3px：
第一个

赞(0）回复(0）举报 2022-12-05

我来回答

为什么'width：100vw' CSS规则会产生滚动条？

2条答案

相关问题

热门标签

最新问答