HTML/CSS 中带 div 的水平（内联）列表

我正在尝试构建一个简单的水平列表，其中每个列表项都是一个 div，我希望它们全部坐在一起。当我尝试使用下面的代码时，div 最终会出现在不同的行上。这是我所得到的：

HTML:

<ul id="navlist">
<li><div>...</div></li>
<li><div>...</div></li>
<li><div>...</div></li>
</ul>

CSS:

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

我试图给我的 div 一个最大宽度和一个宽度，但这也不起作用。基本上，它们在不同的行上显示时没有项目符号点。

非常感谢有关解决此问题的一些帮助，谢谢！

#navlist li { display:inline }
#navlist div { display:inline }

制作<li>内联，同时离开<div>因为块是你的问题。

或者，您可能想要inline-block为了<li>如果您要控制尺寸或边距。

您可能还对此演示感兴趣：http://phrogz.net/JS/ul2menu/purecss_testsuite.html

我不知道你为什么有<div>在你的里面<li>，但我想你有你的理由。