2016-12-02 8 views
0

ラッピングアイテムの高さが異なるブートストラップグリッドを使用している場合、各行に同じ数のアイテムがあるように、以下のようなルールを使用します。最初のアイテムをスキップして、毎回ルールを繰り返す

.col-sm-6:nth-child(3), 
.col-sm-6:nth-child(5), 
.col-sm-6:nth-child(7), 
.col-sm-6:nth-child(9) { 
    clear: both; 
} 

私はこれを行う最良の方法ではないことを知っています。私は非常に大きなグリッドを持っている場合、私はこれを明示的に行うすべての行にクリアを指定する必要があります。

ラッピング要素の各行の開始を指定することなく繰り返し規則として書き込むにはどうすればよいですか?

答えて

1
.col-sm-6:nth-child(2n + 3) { 
    clear: both; 
} 

しかし、私はあなたがfloatclearハックを避けるために、フレキシボックスを使用することをお勧めします。

ちょうどあなたのコンテナに追加します。

.some-container { 
    display: flex; 
    flex-wrap: wrap; 
} 
関連する問題