29767


サンプルコードで、

`flex: 1 1 100%;  
max-width: none;`

などと書かれているものがありました。  
今まで何となく使っていたのですが、正しい違いを教えていただけますか。


CC BY-SA 3.0
2016-09-30T08:18:04.957
29266
2016-10-21T08:40:46.457
14879
question
html css
flexBoxのflex-basisとmax-widthの違いは何でしょうか？


`flex-basis`は`flex`の中での`width`と同等と思ってよいかと思います。  
`max-width`は`flex`に限らず最大幅はここまでと固定します。

`flex-basis`と同時に`width`も指定されていると`flex-basis`の値が適用されます。  
しかし`max-width`は「最大はここまでって言ってるだろ！」と`flex-basis`や`width`より強力なので、同時に指定されていると`max-
width`が適用されます。  
_※`flex-basis`の値が`max-width`の値を超えた場合。超えていなければ`flex-basis`の値が適用されます。_

質問の例だと、どこかで`max-width`が指定されているのだと思います。  
それをなしにして`flex-basis`の値が適用されるようにしていますね。


CC BY-SA 3.0
2016-10-21T08:40:46.457
29767
2016-10-21T08:40:46.457
19243
29266
answer