如何删除缩略图网格空白处

我试图创建一个DIV elemtents一个网格，它看起来像这样的时刻：如何删除缩略图网格空白处

enter image description here

“2”是更大的目的，但是当我使其更大，在其左侧有空的空间，其他小块不会去那里。我的问题是：我如何获得“5”空间以及6到5,7到6等。我该如何摆脱这个空白空间？

一些代码：

CSS：

.block 
    position: relative 
    float: left 
    display: inline

HTML：

<div class='grid'> 
     <div class='block block-1'><span>1</span></div> 
     <div class='block block-2'><span>2</span></div> 
     <div class='block block-1'><span>3</span></div> 
     <div class='block block-1'><span>4</span></div> 
     .... 
</div>

我是否需要JavaScript来做到这一点，还是有一个HTML/CSS的解决方案吗？

来源

2015-02-05 Colin

也许column-count可以帮助你[link]（https://www.google.es/url?sa=t&source=web&rct=j&ei=97HTVMqsJIzYavyUgOAC&url=http://css-tricks.com/almanac/properties/ c/column-count /＆ved = 0CCIQFjAC＆usg = AFQjCNHp65ilNG4LwWEK3yK4WWOU6WB5qQ＆sig2 = oiht-g5u_SaHvPggNjYdaQ） – fcastillo 2015-02-05 18:12:10

@fcastillo我试过了，但它没有区别..我想因为我的块已经是％宽度了。 – Colin 2015-02-05 18:38:51

你可能想看看这篇文章[http://stackoverflow.com/questions/11136286/css-float-empty-spaces][1] [1]：HTTP：//计算器。 com/questions/11136286/css-float-empty-spaces – imnancysun 2015-02-05 18:45:47

你不能这样做使用纯CSS和HTML。 Jquery Mansory通过对所有元素进行复杂的数学评估来解决此问题。

来源

2015-02-05 19:50:24

如何删除缩略图网格空白处

回答

相关问题