Question

我是一名偶尔会涉及一些前端实验的交互设计师，但我绝对不是一个开发人员，所以道歉是这个问题没有得到很好的表达或相关。我最近一直喜欢根据this article中的建议重置盒子大小，但也开始玩flexbox属性。正如我所读到的那样，Flexbox对于盒子模型是一个完全不同的看法，我想知道它是否使重置盒子大小的概念无关紧要或一个坏主意？

Answer 1

不是......这两者并没有真正相关。

flexbox仍然使用值，您希望这些值代表他们所说的内容。

您可能拥有max/min width且padding的div，并且您希望该值正确。

flexbox并不代表box-sizing是自动的，也不是因素。

From the Spec

对于所有其他值，flex-basis的解析方式与水平书写模式下的宽度相同[CSS21]：flex-basis的百分比值是针对flex项目的包含块（即其flex容器）解析的，如果包含块的大小是不确定的，结果与auto的主要大小相同。类似地，flex-basis确定内容框的大小，除非另有说明，例如通过box-sizing

请参阅：

＆＃13;

.wrap {
  display: flex;
  margin-bottom: 10px;
}
.content {
  background: red;
  height: 75px;
  flex: 0 0 150px; /* max-width 150px */
  padding: 0 25px;
}
.boxy .content {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

＆＃13;

<div class="wrap boxy">
  <div class="content"></div>
</div>

<div class="wrap">
  <div class="content"></div>
</div>

＆＃13;

在使用flexbox时，是否将box-sizing重置为border-box相关？

1 个答案: