css - 两列 - 一侧有多行的更多信息

Question

我对此有点困惑。

目前有一个表，有两列。

左边是描述，右边是事实。

左侧通常是一行，但也可能会重叠成两行。

右侧通常是 3、4 或更多行。

我如何使用 CSS 而不是表格来安排它。

很明显，每一行信息的两侧都要排队。

desc1        fact 1
desc2        fact 2
             more to fact 2
desc3        fact 3

等等

Answer 1

像这样？

HTML

<ul class="sublist">
  <li>Item 1</li>
  <li>Description 1</li>
</ul>
<ul class="sublist">
  <li>Item 2</li>
  <li>Description 2 / Description 2 / Description 2 / Description 2</li>
</ul>
<ul class="sublist">
  <li>Item 3</li>
  <li>Description 3</li>
</ul>

CSS

ul.sublist > li {
  display: inline-block;
  max-width: 150px;
  vertical-align: top;
}

Demo