我正在设置一个由DL块组成的菜单，每个块都包含某些选项。
这些DLs 都有不同的高度，尽管它们都保持相同的宽度，所以我可以一次装两个。这些DLs 包含在一个div区域内。
我正在尝试做的是，当一个块明显比另一个块长时，排队的下一个块将挤到一侧并出现在其下方块的下方。
<div id="contentarea">
<dl>This Dl has one DT and two DDs in it, one per line.</dl>
<dl>This DL has one DT and six DDs in it, one per line.</dl>
<dl>This DL has one DT and four DDs in it, one per line.</dl>
</div>
这个想法是，由于第二个DL占用更多的垂直空间，第三个DL会自动将自己推到右侧并占据第一个下方的空间DL。如果这第三个DL 会使左侧比右侧长，那么下一个 L 会向右DL走。如果相同或更少，则再次向左移动，直到超过右侧。
我会注意到，我试图不将DLs 定义为具有不同的类。
在我的 CSS 中，我将我DL的 s 定义为displayas inline-block，因为这只是inline导致它们实际上没有正确使用右侧，而只是d在它之前的一个下方显示每个 l。
但是inline-block，他们所做的只是制作单独的行而不填充一些DLs 之间的空间。有了inline-block，他们现在也使用右侧，但是当第三个进来时，它会下降到最长点以下，而不是像我想要的那样尝试填充下一个直接点。