CSS中的Colomn計數問題

Question

列應填充高度限制。它在Chrome中工作正常，但不在IE和Firefox中。

在IE和firefox它均勻分佈而不是採取列的高度。我共有16個子divs，我希望他們進來5 5 5 1，這是工作的罰款在chrome（5 5 5 1）不firefox和IE（4 4 4 4）

這裏是我的代碼 -

<div class="example"> 
    <div class="example-auto">1A</div> 
    <div class="example-auto">1B</div> 
    <div class="example-auto">1C</div> 
    <div class="example-auto">1D</div> 
    <div class="example-auto">2A</div> 
    <div class="example-auto">2B</div> 
    <div class="example-auto">2C</div> 
    <div class="example-auto">2D</div> 
    <div class="example-auto">3A</div> 
    <div class="example-auto">3B</div> 
    <div class="example-auto">3C</div> 
    <div class="example-auto">3D</div> 
    <div class="example-auto">4A</div> 
    <div class="example-auto">4A</div> 
    <div class="example-auto">4A</div> 
    <div class="example-auto">4A</div> 
</div> 

CSS

.example { 
    -webkit-columns: 4; 
    -moz-columns: 4; 
    columns: 4; 
    height:100px; 
    border: 1px solid rgba(0, 0, 0, 0.1); 
    padding: 0 0.5em; 
} 

.example-auto { 
    -webkit-column-fill: auto; 
    -moz-column-fill: auto; 
    column-fill: auto; 
} 

Answer 1

你需要給欄填寫：自動;在同一班，你給列：4; 不需要在兒童課堂上給它。

.example { 
    -webkit-columns: 4; 
    -moz-columns: 4; 
    columns: 4; 
    height:100px; 
    border: 1px solid rgba(0, 0, 0, 0.1); 
    padding: 0 0.5em; 
    -webkit-column-fill: auto; 
    -moz-column-fill: auto; 
    column-fill: auto; 
} 

您可以在這裏查看示例。 http://jsfiddle.net/VijayDhanvai/0r600sg2/