解决方案：
设置
margin子元素，而不是在
padding你的
flex项目。
.Row{ display:flex;}.Item{ display:flex; flex:1; flex-direction:column;}.Item > div{ background:#7ae; margin:0 10px 10px 0;}.Flx2{ flex:2;}<div > <div > <div>1A</div> </div> <div > <div>1B</div> </div> <div > <div>1C</div> </div></div><div > <div > <div>2A</div> </div> <div > <div>2B</div> </div></div>问题：
计算不使用
padding。所以; 添加
padding到
flex元素并不能按照规范为您提供预期的宽度 。
例如，一个浮动的自动调整大小的伸缩容器中伸缩项目的可用空间为：
- flex容器的包含块的宽度减去flex容器的边距，边框和水平尺寸中的填充
- 垂直尺寸无限
为什么不计算填充？这就是规范想要的。
确定可用的
main和cross空间的flex项目。对于每个维度，如果flexcontainer内容框的该维度是确定的尺寸，请使用该尺寸；如果flex container尺寸在min或max-content约束下确定，则该维度中的可用空间就是该约束；否则， 从该维度中可伸缩容器的可用空间中减去伸缩容器的边距，边框和边距，然后使用该值
。 这可能会导致无穷大的值。
如果从元素的大小中减去
padding和
margin，则会得到：
1A + 1B = 2A
但是，执行完此操作后，将填充添加到元素中。元素越多，填充越多。宽度未计算出来，导致您的陈述为假。
