Question

我很难使用css布置对象，

由于代表无法发布图片，因此图片会在此处托管....

http://i49.tinypic.com/3yfxc.png

用于每个用div标记的图像的css ive如下

#compbox img {
  float:left;
   margin:5px;
}
#compwinnerbox img {
  float:left;
  margin:5px;
}

每个盒子都有等等，虽然我怎样才能在底行填充第3个盒子来填补空白 - 所以从某种意义上来说是浮动的？对不起，如果我没有解释得太好。

Answer 1

使用CSS和您的布局，在specs on floats：

的情况下，您无法执行此操作

5 - 浮动框的外部顶部可能不会高于任何块的外部顶部或由前面的元素生成的浮动框。来源文件。

Answer 2

使用jQuery Masonry：http://masonry.desandro.com/

或者对于CSS方法使用column

.col {
 -moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:10px;
-moz-column-gap:10px; /* Firefox */
-webkit-column-gap:10px; /* Safari and Chrome */
column-gap:2;
}

http://jsfiddle.net/4gXCs/3/

CSS框图像 - 布局问题

2 个答案: