css - 垂直对齐 2 个并排自动宽度 DIV 的内容

Question

我尝试了 html 元素和 CSS 的各种组合来使其正常工作，但没有成功。我如何完成以下任务？

我有两个并排的 DIV，我想根据其内容的宽度自动调整大小(为此使用“display: inline-block”)。然后，我希望每个 DIV 的内容与 DIV 的顶部对齐(默认情况下，内容是底部对齐的)。内容是许多标签(跨度)和文本(数据库数据)。另外，这两个 DIV 应该位于页面左侧另一个 DIV(即菜单)的右侧。

MENU      AUTO            ANOTHER
FIXED     WIDTH           COLUMN (DIV)
WIDTH     DIV             ALSO
DIV       ACCORDING       AUTO
          TO              SIZED
          CONTENTS        TOP-ALIGNED
          TOP-ALIGNED     CONTENTS
          CONTENTS        SOME
          SOME            PADDING
          PADDING TO      TO MY LEFT
          MY LEFT AND     AND RIGHT
          RIGHT

Answer 1

您必须vertical-align:top父(列)div，以及内部的span。 display:inline-block 使宽度和高度变为自动(就像内联元素一样)，正如您所说，默认垂直对齐是基线。

http://jsfiddle.net/EjdUf/1/