Html 为什么'；嵌套flexbox是否会增长到全宽？

考虑以下HTML/CSS：

我是一个嵌套的flexbox

嵌套的div块（浅蓝色背景色）只占用所需的空间（宽度）。通过将嵌套块的文本加倍，可以看到这一点

这是默认行为和上下文格式的问题：

---

如果您希望它采用全宽，那么您可以选择添加

width:100%

或

flex:1

在嵌套div的CSS中。

浅蓝色div实际上是一个。弹性物品的种类包括：

flex-grow: 0;
flex-shrink: 1;
flex-basis: auto;

---

因此，项目不会增长以填充剩余空间，它会收缩，并查看我的宽度或高度属性作为基础。

我理解这一点，但为什么嵌套flexbox的行为与外部flexbox不同？外部的会增长到可用空间，内部的只会增长到其内容大小，而不会增长到可用空间。感谢您的提示，我在创建简化示例时的错误）：将接受Salman的答案，因为他提供了flex item属性来解释行为，很抱歉首先没有提供正确的示例，我的错@stefanatwpf：它确实像zerbene一样过时：这是因为默认设置flexbox容器的子元素“只占用它所需的空间（宽度）”。其实很简单…；-）@Brebber你是对的，但我发现Salman的答案更清楚/详细，给出了flex项的默认属性。但这两个答案在某种程度上都是正确的：-）