我有点害怕使用float，因为我还不理解清除float以及互联网上关于该活动的所有技巧，所以我使用display:inline块以内联方式放置两个div。他们的集装箱有
width:auto;
max-width:900px;
每个div都有
display:inline-block;
width: 450px;
现在，无论我做什么，第二个div总是在第一个div的正下方打断另一行
这是代码：http://codepen.io/anon/pen/xgtFd
我已经修改了两个div的宽度，比如
width:440px;
但这无济于事。第二个div仍然有点"错位"。这很奇怪，因为我正在制作一个网站，并在这个项目中使用与我的标题几乎相同的方法。请帮我确定问题。
我很乐意得到任何帮助。
宽度太宽。
将导航降低到大约446px，然后它们就回来了。
为什么444px而不是450px？两个原因：
- 你的边界是2px
- 标记中的
<div>标记之间存在空白，这反映在呈现中。如果您希望它能够使其为450px，请将关闭的div标记和下一个打开的div标记紧邻，如下所示：</div><div id="nav">
如果您希望能够保留边界，并将宽度设置为450px，那么您应该签出box-sizing，并使用box-sizing: border-box;。
编辑：
为了解决垂直对齐问题，您需要将vertical-align: top;应用于div元素(导航和徽标div(。
而且，ul不是居中的，因为当您将display:block应用于它时，它会填充整个宽度。因此，您可以使div的内容以text-align: center为中心位于ul上，也可以使ul为display: inline-block。