ブートストラップ4整列は、私たちは、ソーシャルメディアのページを作っているclearfix

Question

ずに浮きます。箱の間には空白がたくさんありますが、これはclearfixによって引き起こされる疑いがあります。

私たちが適切な「浮動小数点数」を、各divボックスと同じ間隔を置いて配置する方法はありますか？しかし、実際には複数の '行' divのメソッドを使用したり、間にclearfix divを持つことはできません。これは、ページのレンダリングにVueJSの双方向バインディングを使用しているためです。

編集：Bootstrap grid with different image heightsこの問題は解決しませんでした。 @media (min-width: 768px) { .row > .col-md-6:nth-child(2n+1) { clear: left; } } は、問題を解決していないし、htmlを生成するためにforeachループが使用されているため、clearfixクラスを使用することもできません。

Answer 1

最高のdivのclass = "col-xs-6 col-sm-4 col-md-4 col-lg-3"の高さを設定してみてください。

Answer 2

私はsimilar question hereと回答しました。これは明らかな問題です。

X列ごとにフロートをリセットするには、ブートストラップのclearfixリセットまたはCSSを使用する必要があります。