flex-basis: 0％;なのにどうして表示されているのですか？

Question

最近CSSを勉強し始めた初心者です。

flex: 1;
と指定すると
flex: 1 1 0%;
となると思うのですが、要素の幅が0％の場合、要素が消えてしまうのではないかと思いました。

実際してみると、表示されているので疑問に思い質問させて頂きました。

0％は指定しないという意味ではないですよね？

よろしくお願いします。

Accepted Answer

> flex: 1;
と指定すると
flex: 1 1 0%;
となる

~~ならんですよ。~~
間違えていましたので、削除いたします。失礼いたしました。

> その一括指定が対応する個別プロパティの内、**省略したプロパティ全てに初期値**が設定されます。
[一括指定プロパティ - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/Shorthand_properties#Tricky_edge_cases)

　
> 初期値	1
[flex-shrink - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/initial_value)

　
> 初期値	0
[flex-grow - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/flex-grow#Specifications)

　
> 初期値	auto
[flex-basis - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/flex-basis#Specifications)

### 誤回答のため、追記修正

maisumakunさんからコメントをいただいたとおり、
```css
  flex: 1;
```
は
```css
  flex: 1 1 0;
```
となるので、`flex-grow`が`1`なので`0px`からコンテナの余剰分、幅が拡大する、ということですね。
大変失礼いたしました。

誤回答のため、追記修正

関連した質問