小编v4y*_*oCP的帖子

我想知道如何flex-basis: auto & min-width: 0和width: auto计算(width未设置父元素和Flex项目).因此,我确认了W3C的规格.我的理解如下吗？

flex-basis: auto(没有min-width: 0设置父元素的宽度定义)

我将阅读这一部分(7.1.弹性速记).然后我发现用的flex-basis: content是什么时候flex-basis: auto.计算值flex-basis: content似乎在第9章" 柔性布局算法"中描述.

汽车

在flex项上指定时,auto关键字将使用main size属性的值作为使用的flex-basis.如果该值本身是auto,则使用的值是content.

内容

表示基于弹性项目内容的自动大小.(它通常等同于最大内容大小,但通过调整处理宽高比,内部大小限制和正交流;请参阅§9Flex布局算法中的详细信息.)

我已经阅读了第9章.然后我知道有关的条款flex-basis是9.2.3-C线长确定.

如果所使用的柔性基础是内容或取决于其可用空间,和柔性容器被一分钟的内容或MAX-内容约束下的尺寸(例如,执行自动表的布局[CSS21]时),尺寸约束下的项目.flex基本大小是项目的主要大小.

.container {
  display: flex;
  border: 3px solid green;
  overflow-wrap: break-word;
}

.box1 {
  flex-basis: content;
  /* `flex-basis: auto` works the same way */
  border: 3px solid red;
}

<div …