需求：一个容器里面有若干直接子元素，竖向排列，假设固定容器高度只能够装下5个。
第6个元素会换到另一列继续竖向排序。
请教各位如何用CSS显示这个布局。注意：1、所有元素必须有一个共同的父级容器，不能分成两列。2、要兼容IE9，flex用不了。
1 回答
慕码人8056858
TA贡献1803条经验 获得超6个赞
<!DOCTYPE html><html><head>
<style>
#mainBox { border: 1px #f00 solid; width: 300px; height: 250px; writing-mode: tb-lr;/*IE写法*/
writing-mode: vertical-lr;
} #mainBox a { margin: 5px; padding: 0px; display: inline-block; width: 30px; height: 30px; border: 1px #00f solid; writing-mode: lr-tb;
} </style></head><body>
<div id="mainBox">
<a href="#">1</a>
<a href="#">2</a>
<a href="#">3</a>
<a href="#">4</a>
<a href="#">5</a>
<a href="#">6</a>
<a href="#">7</a>
<a href="#">8</a>
<a href="#">9</a>
<a href="#">10</a>
</div></body></html>- 1 回答
- 0 关注
- 188 浏览
添加回答
举报
0/150
提交
取消