Html 使用flexbox为一列宽度留出空间

我有一个父div和两个div。我想为这些子div保留特定的大小（列）。这在flexbox中可能吗？我在为这个苦苦挣扎

<div class="parent"> 
   <div class="child"></div>
   <div class="child"></div>
</div>

---

第一个子项的宽度应为1列，第二个子项的宽度应为2列。在右侧，我希望有1列宽的空白（因此父div的行为应该像它有4列一样）。

您可以通过使用占用第四列的伪元素使用flexbox来实现这一点：

• 将

  flex:1

  添加到第一个子

  和伪元素中
  

• 将

  flex:2

  添加到第二个子

  中
  

请参见下面的演示：

.parent{
显示器：flex；
高度：100px；
边框：1px实心#ddd；
}
.孩子{
边框：1px实心卡德蓝；
背景：浅蓝色；
弹性：1；
}
.孩子{
弹性：2；
}
.家长：之后{
内容：''；
弹性：1；
}

这里有一种方法，用于将弹性项目设置为特定的百分比宽度

在本例中，两个flex项既不能也不能。将100%宽度拆分为四列，每列需要为父级宽度的25%。第一项为25%，第二项为50%（两列宽），在右侧留下25%的空间

.parent{
显示器：flex；
最小高度：10em；
边框：1px实心#CCC；
}
.孩子{
外形：1px纯黑；
背景颜色：浅灰色；
}
.子女：第n名子女（1）{
弹性：0.25%
}
.子女：第n名子女（2）{
弹性：0.50%；
}

---

似乎没有人建议您只需设置父对象的宽度：

.parent{
宽度：75%；
显示器：flex；
}
.孩子{
弹性：150；
高度：2em；
边框：1px实心#000；
}
.孩子：第一个孩子{
弹性：75；
}

25%和50%宽度，否？@TemaniAfif更多-更少-是，但如果可能的话，最好在两者之间有自动空格。请也包括您的CSS，以演示您被卡住的地方。然后您不需要CSS网格flexbox@TemaniAfif非常感谢。我想我会用网格来做的。