浮动列表较大的中间项目周围的项目

时间:2014-01-23 14:49:52

标签: html css css-float html-lists

这是一个难以解释的问题,所以我提供了一个例子(没有足够的声誉来发布图像)。我想在包装类别类型列表的中间包含一个较高列表项的列表项(左侧和右侧)。

1  2  3
4  2  5
6  7  8

如您所见,项目2的高度是其他列表项目的两倍(相当于行数2作为表格单元格)。只有一个float:left属性,第4项将出现在第2项的右下角,5,6,7将出现在第3行,8则出现在新第4行。左下角的空格将是2空。像这样:

1  2  3
   2  4
5  6  7
8

我希望浮动元素在浮动到元素右侧之前将此可用空间填充到2的左下角。这可能吗?谢谢!

编辑:我忘了提到这应该是一个流畅的布局,所以如果我将窗口拖得更小,它会减少到两列,看起来像这样:

1  2
3  2
4  5
6  7
8

0 个答案:

没有答案