CSS和景观

Question

我是编程方面的新手，我试图建立我的网站，但我遇到了一个问题：

当我在横向页面视图中打开我的网站时，蓝色列会显示在其右侧。它不适合页面的100％宽度。当我向下滚动时，我的粘性菜单可以填充它。有谁知道为什么？

jsFiddle https://jsfiddle.net/user582/ycx56p4h/1/

Site in googledevtools

Answer 1

最简单的答案是你需要限制页面的宽度并隐藏所有溢出。为此，您可以使用：

html{
  max-width: 100vw;
  overflow-x: hidden;
}

vw单位对于人们来说很不为人知，但它非常有用，因为它匹配用户的视口宽度。设置max-width后，可以使用overflow-x隐藏x轴上的所有溢出。