具有自然行为的样式列表

Nic*_*ico 3 css

我想像这样设计一个css列表

[ 1 ][ 2 ]
[ 3 ][ 4 ]
[ 5 ][ 6 ]
Run Code Online (Sandbox Code Playgroud)

使用float时基本没问题:左但是有一个问题,当[4]比3更高时,会发生以下情况:

[ 1 ][ 2 ]
[ 3 ][ 4 ]
     [   ]
[ 5 ][ 6 ]
Run Code Online (Sandbox Code Playgroud)

但我想表现得像这样:

[ 1 ][ 2 ]
[ 3 ][ 4 ]
[ 5 ][   ]
[ 7 ][ 6 ]
Run Code Online (Sandbox Code Playgroud)

请看一下这个问题:http: //xbox360livegold.nl/gastenboek

Emi*_*ily 6

我认为你不能在纯CSS中做到这一点,除非你提前知道每个项目的样子,并且我假设这是你排队的网站上的新闻提要部分.您可以使用类似JQuery Masonry库的东西来完成它.