Bootstrap/CSS：Clearfixが偶数/奇数インデックスに影響する

Question

高さの異なる列を使用すると、ブートストラップグリッドが壊れるのを防ぐためにclearfixを使用しています。

ただし、文書にclearfix divが追加されると、ソースの後ろに表示される列は、実際に実行されるのとは異なる偶数/奇数インデックスを持つように動作します。

私は適切なdemoを作成しました。ご覧のように、clearfix divを削除すると、divの色が変更されたように変更されます。

何が原因なのか、それを修正するために何ができるのか分かりますか？

Answer 1

もしnth-of-typedefinitionを見れば、それは

を指定：第n-最後の型（+ B）擬似クラス表記は、と+ B-1の兄弟を有する要素を表します同じ展開された要素名のそれは、ドキュメントツリー内で、nのゼロまたは正の整数値に対して、親要素を持ちます。参照：その引数の構文については、nth-child（）疑似クラスを参照してください。

ここで重要なことは、それが述べていることである：

同じ拡張要素名

だから、その文字通り、CSSセレクタのターゲットの特定の要素とを取ります奇数および偶数は、特定の要素の名前で一致し、特定のセレクタを使用して一致した要素ではありません。

divをspanに置き換えるのは、それが別の要素であるため、決して一致しないように機能するためです。