Html FlexBox-指定某个子div来控制宽度？

使用flexbox，默认情况下，子对象将根据最宽的元素调整大小

是否有某种方法可以定义某个特定的子对象将控制宽度，即使它较小？也许有选择器

代码笔：

代码：

.center{
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
.首先{
边框：1px纯红；
利润底部：0.5vw；
}
.第二{
边框：1px纯红；
}
.包装纸{
字体系列：Calibri；
显示器：flex；
弯曲方向：立柱；
}

这个部门更大。然而，它能根据它的兄弟收缩吗？
这个div比较小。它能控制宽度吗？

以下是需要了解的重要CSS规则：

flex:{number}{number}{number}

第三个数字是弹性项的默认大小（宽度，如果弹性项在一行中）。默认情况下，它是

auto

，这意味着弹性项的默认大小由其内容决定

第一个和第二个数字是与其他弹性项目（如果该弹性项目在一行中）相比，如果主轴上有空间，则第一个和第二个数字分别成比例地增加或减少多少

因此，不能将flex项的默认大小设置为相对于同级项的固有大小（即，由其内容决定的大小），但可以将flex项（及其同级项）的默认大小设置为相同，并允许其增大或减小

我发现自己经常做以下事情：

flex:100

在导致同级大小相同的flex项目上

所有flex项目都以默认大小0开始，并且它们的增长都是相等的——正如所有flex项目的第一个数字相同（这里是一个数字，但可以是任何正数，只要每个兄弟姐妹都相同）——这是它们需要的

最好的flexbox学习方法是：

编辑

如果您事先知道哪个项目本质上更大，您可能可以通过将该项目设置为

flex:0 auto

并让所有其他flex项目从

flex:1 0 0

增长来实现，但我感觉您事先不知道哪个项目更大

.wrapper{display:flex；}
.wrapper>div{border:1px solid#000；}
.first{flex:100；}
.second{flex:0 1 auto；}

这个部门更大。然而，它能根据它的兄弟收缩吗？
这个div比较小。它能控制宽度吗？

我想澄清一下，您是否希望较小的孩子有自己的宽度，只和它的内容一样大，还是你想让较小的子元素制作一个比它的内容更大的div？你是说你想让所有div都不比自然最窄的div宽？我想要一个特定的div来控制其他元素的宽度。如果它变大了，它们就会变大。如果它变小了，其他的就变小了。@DavidSomekh-不能用flex box来完成。容器中的所有flex项的大小不能相对于（未指定）单个flex项的固有大小。我觉得你问的问题太具体了（通常情况下是这样的）-期望的结果是什么？