COMMENT
コメント一覧 (2)
-
- 2018/12/10 13:17
-
間違いというわけではないのですが、
> flex-grow, flex-shrink 使うときは width じゃなくて flex-basis の方を設定する
という言い回しがこの記事を読んだ方に誤解を与えるといけないのでコメントさせていただきます。
最初のCSSで幅が無視されて小さく表示されてしまうのはwidthに指定しているからというより、flex-basisが0になっているからと言ったの方が正確な気がします。`flex 0 1`としてした場合flex-basisは0になるようです。
flex-basisをauto、つまり`flex 0 1 auto`と指定すればwidthでも期待した通りになると思います。
> basis をもとに伸縮してくれる
こちらはご指摘の通りで、flex-basisはflexアイテムのgrow/shrinkを計算するために使われる元となるサイズです。autoにしておけばそのアイテムのwidthを元に計算されます。
flexの幅の計算方法はこちらが詳しいです。
http://memowomome.hatenablog.com/entry/2016/09/06/080000
-
- 2.
- 2018/12/10 16:54
-
ななしさん
コメントありがとうございます
auto がデフォルトじゃなかったのですね
デフォルトが 0 で grow を許可せず shrink のみ許可なので最小サイズというので理解できます
（前にもこの辺のデフォルトにやられた覚えが……）
- 2.
