[英]How to lay down elements vertically from top to bottom, and then from right to left, using a clean HTML markup?
我有一些具有预定义尺寸的块级(或内联块,无关紧要)元素。 我希望它们位于容器div
的右上角。 我希望它们从上到下依次定位在另一个旁边。 当没有足够的空间时,我想在前一个的左边有一个新列,也是从顶部到底部。
换句话说,我想要这样的东西:
.------------.
| 4 1 |
| 5 2 |
| 3 |
'------------'
如何使用带有干净HTML的纯CSS解决方案来实现它?
如果它可以适应可用的高度更好。
结合column-width: <something>; column-gap: 0;
column-width: <something>; column-gap: 0;
,我可以达到这个效果:
.------------.
| 1 4 |
| 2 5 |
| 3 |
'------------'
随着float: right;
,我可以达到这个效果:
.------------.
| 3 2 1 |
| 5 4 |
| |
'------------'
如果更改了写入模式,则可以使列模块执行您想要的操作:
ul {
columns: 10em;
direction: rtl;
}
li {
direction: ltr;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.