垂直排列包装的文本[重复]答案

【问题标题】：lining up wrapped texts vertically [duplicate]垂直排列包装的文本[重复]
【发布时间】：2016-02-12 19:30:11
【问题描述】：

我想在一行中开始水平环绕的 li 文本，现在它向上。请看我的例子

HTML

  <ul>
  <li>Long text goes here.</li>
  <li>Another Longer Text Goes Here</li>
  <li>Shorter text</li>
  </ul>

CSS

ul {width:150px;}
li {width:30%; display:inline-block;whitespace:pre-line;}

谢谢。

【问题讨论】：

【解决方案1】：

使用垂直对齐：

li {
   vertical-align: text-top;
}

【讨论】：

【解决方案2】：

因为你为你的 li 元素使用了 inline-block 属性，你可以使用vertical-align来排列它们；

li {
    vertical-align: text-top;
}

【讨论】：