Html 100%宽元素的拉伸不超过视口宽度

基本上，当我把页面缩小到1000px宽时，就足以显示x轴滚动条了。当我向右滚动时，导航栏将停止填充100%的宽度，而不是缩小窗口时的可视宽度

我周围有一把小提琴，弄不明白它为什么要这样做

以下是网页：

---

非常感谢您的帮助。

100%的宽度是父屏幕宽度的100%（即屏幕大小）。您可以向右滚动，因为页眉比它宽，但该条仍然无法填充该宽度

在不修改HTML的情况下，最简单的修复方法是将此样式添加到CSS中。这样做将使导航栏背景至少为1180px，与标题大小相同

.nav-bar {
  min-width: 1180px;
}

---

或者，您可以将导航条放在标题内，这样它将增长到标题宽度的100%。

添加此样式，效果很好

body{ float:left; min-width:100%;}

或

body{ display:inline-block; min-width:100%;}

身体不会自动伸展到100%；所以我们加上这些