Html 导航菜单最后一项在调整大小时出现和消失

我有下面的导航菜单，每当我使用ctrl+右键单击调整大小时，最后一个项目FAQ就会出现并消失。更不用说它也会破坏我的整个网站背景，由两幅图像表示。 有什么问题？如何使其在调整大小时保持不变？干杯

html:

---

您有

溢出：隐藏.nav

元素上设置代码>且未定义宽度

默认情况下，

.nav

设置为100%宽度，因为它是块元素。它将自动跨越它当前所在的父对象的宽度

当您将窗口的大小调整到不适合链接的大小时，它们会落在.nav之外，从视图中隐藏

您可以为

.nav

（或父容器）设置一个固定宽度，以防止其在宽度上塌陷

.nav {
  width: 960px;
}

---

或者，如果您仍然希望它折叠，但仍然显示导航链接，您可以删除

overflow:hidden和元素将出现（但是，它们不会相互内联。
对于第二个习题集

body{
background-repeat:no-repeat;
}

当溢出隐藏时，它将消失；将其设置为“无”

.nav{
width:1000px;
overflow:none;
..
}

我看到的是，您正在尝试将列表元素内联，以便可以尝试以下代码并修改外观：

<ul id="navlist">
<li id="active"><a href="#" id="current">Home</a></li>
<li><a href="#">Here</a></li>
<li><a href="#">There</a></li>
<li><a href="#">Faq</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>


#navlist li
{
display: inline;
list-style-type: none;
padding-right: 20px;
}








#李海军
{
显示：内联；
列表样式类型：无；
右边填充：20px；
}
Axel，谢谢你让我更好地理解这一点。但是，如果我缩小，将菜单设置为固定宽度，菜单最后一项仍然会折叠…blackbee，使用固定宽度，溢出设置为无，当我缩小时，最后一项仍然位于主菜单下…也许我应该将整个页面放在JSFIDLE上，让你们看到…什么你在寻找结果吗？这里没有什么不寻常的地方。你正在使用可变宽度和静态内容。如果宽度不够宽，无法容纳内容，它将崩溃或消失，具体取决于你如何设置父容器。我建议你使用一些浏览器调试工具来调整字体大小、边距和大小d宽度，以确定页面内容所需的最佳CSS属性。
.nav{
width:1000px;
overflow:none;
..
}

<ul id="navlist">
<li id="active"><a href="#" id="current">Home</a></li>
<li><a href="#">Here</a></li>
<li><a href="#">There</a></li>
<li><a href="#">Faq</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>


#navlist li
{
display: inline;
list-style-type: none;
padding-right: 20px;
}