在一個div的左上角對齊一組圖片與CSS

Question

我用這個代碼：

.photocontents { 
    position: relative; 
    display: inline-block; 
    padding: 20px; 
    margin: 0px; 
    width: 100%; 
    height: auto; 
} 
.photo { 
    position: relative; 
    float: left; 
    display: inline; 
    padding: 0px; 
    margin: 10px; 
    width: auto; 
    height: auto; 
} 

，使具有圖像的結果的照片庫（A）。

我想要的是將這些照片排列在頂部，如圖（b）所示。 這怎麼可能？

Answer 1

這是不可能用純CSS。你必須使用一些Javascript。

這些jQuery插件正在做的正是你要尋找的：

1. jQuery Isotope
2. jQuery Masonry