CSS塊並排

Question

這可能與CSS有關。

我嘗試這樣做：

#gallery_ul { 
     display: inline-block; 
     list-style: none outside none; 
     margin: auto auto auto auto; 
     width: 986px; 
    } 

    #gallery_ul li { 
     float:left; 
     margin:10px; 
     padding:10px; 
     text-align:center; 
     border:1px solid grey; 
     width:274px; 
    } 

    #gallery_ul img { 
     padding-bottom:5px; 
    } 

如果是的話怎麼樣？謝謝。

Answer 1

你可以用CSS-columns或javascript來做到這一點。我會建議JavaScript，除非你不必擔心瀏覽器支持/怪癖太多。

見砌築插件最流行的方式這樣做：http://masonry.desandro.com/

Answer 2

可以。但我認爲你必須更具體。

一個近似值是創建每個塊並設置「float：left」屬性，然後方塊將自動組織，或者您可以創建三個垂直列，然後將方塊放在裏面。