html - 从下到上渲染 <ul> 元素

Question

我有一个带有可变元素计数的 ul。当 li 太宽而列表无法在单行中处理它们时，它会打断该行并开始在较低的行上呈现 li，所以我得到如下内容:

x - 代表列表的元素

| - 代表列表边界，或任何限制列表宽度的东西

|xxxxxxxxx|<- elements reached the end of container and remaining elements will be rendered below
|xxxx     |

我需要的是从下到上渲染元素，这样我可以获得:

|xxxx     |
|xxxxxxxxx|<- elements reached the end of container and remaining elements will be rendered above

这可能吗？

下面是一些示例代码

<ul>
  <li>Some content</li>
  <li>Other content</li>
  <li>ContentContent</li>
  <li>Zawartość Contentu</li>
</ul>

目前，它是无 CSS 的。我可以添加您推荐的任何内容以使其呈现自下而上的顺序。类似 float:bottom 的东西，不幸的是它不存在。

Answer 1

ul, ul li {
-webkit-transform: scaleY(-1);
   -moz-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
     -o-transform: scaleY(-1);
        transform: scaleY(-1);

}
ul {
    width: 350px;
}
 li {
    display: inline-block;
    width: 70px;
    zoom: 1;         
    *display: inline;
}

来源:Bottom to top <ul> element arrangement