2016-04-29 5 views
0

VWとVHユニットを使用して不規則な行のボックスを作成したいと思います。CSS不規則な行、8の行、8の行が繰り返される

私は、8つのボックスの行の後に7つのボックスの行、その後に7つのボックスの行などがあります。私はこれがnth子供と可能であるべきだと思うが、私はそれを管理することができない。ここで

は、私がこれまで理論的には

https://jsfiddle.net/kjLt55ne/

.box:nth-child(9), .box:nth-child(24n+24) {margin-left: 5.7vw; background-color: red;} 
.box:nth-child(16n) {background-color:green; clear: left;} 

を持っているものだ私が行うことができる必要があります:

クリアセット
  • :右のすべての16の要素に
  • 16番目の要素ごとに余白を設定します。9から始まります。

しかし、これはうまくいきません。誰も私が任意の数の要素のためにこれを解決するのを助けることができますか?

答えて

0

質問を投稿した直後に私はそれを直ちに実行しました。

.hex:nth-child(16) {clear: left; background-color: red;} 
.hex:nth-child(15n+16) {clear: left; background-color: red;} 
.hex:nth-child(9) {margin-left: 5.7vw;} 
.hex:nth-child(15n+9) {margin-left: 5.7vw;} 
関連する問題