は、私は、単一のフレックス子供とフレキシボックスを持っている:フレックスの子が肥大化して親をオーバーフローさせる方法
<div class="flex-parent">
<div class="flex-child">
lots of content...
</div>
</div>
.flex-parent
は固定サイズ:
.flex-parent {
height: 250px;
}
フレックス子供はそれが親のサイズをオーバーフローすべきであるので、多くのコンテンツがあります。代わりに、その高さは親の高さ(250ピクセル)に "キャップ"されたままです。
これを修正して.flex-child
の内容を増やすにはどうすればよいですか?私は簡単にdisplay: block
に切り替えることでそれを修正することができますが、私の実際のレイアウトははるかに複雑なので、そのことは実際的ではありません。
問題:http://codepen.io/anon/pen/OWjYwe
それが動作するはずです方法:http://codepen.io/anon/pen/apyraV
'分の高さ:250px' - また、これはないフレックスボックスとは関係がありません。 – Adam
どこで 'min-height'を使用しましたか? – BonsaiOak
私はあなたに、** heightの代わりに 'min-height'を使うべきだと言っています。たぶん私は誤解しているかもしれませんが、あなたが解決しようとしているかもしれないレイアウトの問題は明らかではありません。 – Adam