如何在css中创建三列

时间:2010-08-13 00:26:13

标签: c# css

如果我有一个对象列表,例如List myObjects;列表中可能有2个,20个,50个等项目。

我想要的是能够遍历列表并使用css构建项目的3列视图来布置列。

我该怎么做?我不想做一个循环,每三个项目我再次从1开始,或者这是唯一的方法吗?

我可以简单地遍历项目,将每个对象放入div并让列自己构建吗?

1 个答案:

答案 0 :(得分:2)

如果顺序无关紧要,则将它们放在固定宽度的ul中,然后创建无序列表,列表项为ul宽度的1/3并浮动左

所以

.three-column{
 width: 300px;
}

.three-column li {
 float: left;
 width: 100px;
}

然后坚持下去

退房: http://www.alistapart.com/articles/multicolumnlists/