ブートストラップ折りたたむ問題次の両方directons

Question

で開きます：

私は、私はそれらをフィルタリングするMetafizzy同位体を使用することができますので、divの要素を持つテーブルを再構築しようとしました。ここまでは順調ですね。各列にはアタッチメント/折り畳みを開閉するボタンがあります。折りたたみは上から下に向かってスライドするはずなので、2行で処理したので、2つのli要素で処理しました。しかし、並べ替えを維持するために、私は最初のli要素に崩壊を埋めなければなりませんでした。そして、それは崩壊がスペースが残っていない限り上の要素を上記のdivの上に押し始めた後、完全に開くまで下に移動したときです。これを解決する方法上の任意の提案のための

https://codepen.io/paulhaem/pen/ZJELJr

ありがとう！

Answer 1

現在、行のコンテンツの中心はmin-height: 60px; align-items: center;です。しかし、折り畳み要素を展開すると、コンテンツの高さが60ピクセルを超えて増加するため、折り畳み要素も上がります。現在のマークアップとスタイリングでは、にpadding-topとpadding-bottomを指定することで問題を解決できます。何かのように

li.grid-item__line { 
    padding-top: 15px; 
    padding-bototm: 14px; 
    ... 
}