ID:dW5Lsg さんの質問

cssでflexを適用すると、その子要素の内側の挙動がおかしい。
[ 親要素(display:flex) > 子要素(flexされる要素) > 子要素の内側の要素 ]
子要素の内側の要素に高さ/幅を与えたいとき、
min-height/min-widthを使わないと高さ/幅が確保されなかったり、
min-height/min-widthを使っても100%を指定すると0pxになる(当然そのラッパー要素は高さ/幅があるのに)など、挙動がつかめません。。
何かコツなどあるのでしょうか...??

みんなの回答 2 件

ID:dW5Lsg さんの回答

子要素をposition:absolute;するといいかんじ?
すっごい気持ち悪いけど..

ID:IYz6o4 さんの回答

当然だが子に何も入ってないと高さは確保されない。幅は flex-grow, flex-shrink, flex-basis の理解辺りで躓いてると思われるので、その辺をよく調べておくこと。

ID:gOXUiG

横に並べてる時は、高さが指定できないんです
これはflex-grow, flex-shrink, flex-basisでも関係なさそうです

>当然だが子に何も入ってないと高さは確保されない
heightに値を入力している話なので、確保されるはずです

[ 親要素(display:flex) > 子要素(flexされる要素) > 子要素の内側の要素 ]
この"子要素の内側の要素"(わかりづらくてすみません)にwidth/heightを適用したいのです。

横に並べてるとき、幅はflex-grow, flex-shrink, flex-basisらで指定できるとおもうのですが、高さが%で指定できません...

ID:IYz6o4

子要素の内側=孫でいいじゃん(笑)。
孫の height を % で指定したい場合、子の height が auto 以外でサイズ指定されてないといけない。子の height も % なら親の height が…(以下同文)。これは flex じゃなくて CSS 全般の話。

ID:gOXUiG

ありがとう兄ちゃん>_<

最終更新日:2015-04-10 (2,398 views)

関連するトピックス

ページ上部に戻る