CSS：浮動：左對齊了

Question

我用float:left，現在我的文字看起來像

. A . B . C . 
.  a .  b .  . 
.  .  b . D . 
.  .  b .  d. 
.  .  .  d. 
.  .  .  d. 
. E . F .  . 
.  .  f .  . 

但我想

. A . B . C . 
.  a .  b .  . 
.  .  b . D . 
. E .  b .  d. 
. F .  .  d. 
.  f.  .  d. 
.  f.  .  . 
.  f.  .  . 

我已經試過"display: inline-block" 但它看起來像

. A . B . C . 
.  a .  b .  . 
.  .  b .  . 
.  .  b .  . 
. E . D . F . 
.  .  d .  f. 
.  .  d .  f. 
.  .  d .  f. 
.  .  .  . 

任何人都可以幫忙嗎？

Answer 1

不幸的是，CSS目前不允許您這樣做。但是，有一些JavaScript庫可以做這樣的佈局。一種流行的選擇是Masonry。