私はブートストラップ行を使用しており、応答性を維持しながら、適切なグリッドを機能させるのに役立つことがわかったため、必要なスパンの子をより多く与えています。
各要素には子があり、次のように jQuery を使用して表示される要素があります。
<div class="row">
<div class="span2">
<div class="inner-element">
Content here
<div class="hidden-element">
More content here
</div>
</div>
</div>
...
</div>
内部の特定のボタン.span2
がクリックされると、.hidden-element
div が成長しslideDown();
、内部要素がposition:absolute
CSS を取得するため、下にあるスパンを超えてグリッドを変更しません。
.row
この設定は、ページの右端 (の隅)にない .span2 要素で実行すると、完全に正常に機能します。
このjsFiddle の例でこの問題を確認できます。「例 #1」をクリックすると、親要素が折りたたまれずに正常に動作し、「例 #2」をクリックすると.span2
要素が折りたたまれ、次の.span2
要素が 1 行上にジャンプすることがわかります。
これの原因は何ですか?どうすれば解決できますか?