Question

我经常发现自己正在浏览SOF并且还没有在这里发布。我正在建立一个新的网站，并且是CSS的相对初学者。我正在努力使用基本的导航菜单，而且无法研究如何解决问题。

Here is my website如果您查看“联系人”下拉列表中的内容，您会看到第一个列表项目位于2行，当我只想要它时，就像您在＆＃下看到的那样39;下载＆＃39;下降。

如果有人想要代码

.nav{
width:100%;
background-color: #0066B9;
font-family: verdana;
font-weight: bold;
padding-top: 4px;
padding-bottom: 4px;
max-height: 31px;
}
.nav ul{
top: 0;
width:960px;
margin:0 auto;
list-style: none;
padding-left: 0px;
display: inherit;
}
.nav li{
display: inline;
position: relative;
background-color: #003E64;
padding-top: 4px;
padding-bottom: 4px;
}
.nav ul li a{
color: white;
text-decoration: none;
padding: 10px;
line-height: 21px;
}
.nav ul li a:hover{
background-color: purple;
color: black;
padding-top: 4px;
padding-bottom: 4px;
}
.nav ul li ul{
display: none;
position: absolute;
margin: 0px;
background-color: #003E64;
width: auto;
}
.nav ul > li > ul{
position: absolute;
left: 0;
margin-top: 27px;
display: none;
padding-top: 10px;
overflow: hidden;
}
.nav ul li:hover > ul{
display: block;
padding-left: 6px;
}
.nav ul > li > ul > li{
position: relative;
display: block;
width: auto;
}
.nav ul > li > ul > li a{
padding: 10px;
}

如果我发布错误，请提前道歉。不完全确定它要求我缩进4个空格。

Answer 1

尝试使用white-space CSS属性：

.nav li {
    ...
    white-space: nowrap;
}

https://developer.mozilla.org/en-US/docs/Web/CSS/white-space

当我添加“空格”时，如何确保文本保持在同一行？在里面<li>元素？

1 个答案: