作者:缘来是你2502855331 | 来源:互联网 | 2023-02-05 14:12
从这个JS-Fiddle中可以看出,我基本上尝试使用这个CSS来创建两个应满足这些要求的div:
如果更宽的项目的空间可用两倍,则两者都应使用50%宽度(可行)
如果两个物品的空间不足,它们应该包裹(有效)
如果两个项目都有足够的空间,但是宽度小于宽度的两倍,则较窄的项目应该缩小(这不起作用,它包裹)
我不明白这种行为,因为我已经设置flex-shrink
了flex项目,所以它们应该能够缩小 - 但它们不会:如果较窄的项目宽度小于50%,它会包装.
.m {
display: flex;
flex-wrap: wrap;
}
.l_1 {
background-color: red;
flex: 1 1 50%;
}
.r_1 {
background-color: yellow;
flex: 1 1 50%;
}
left_______________________________________________X
right
(在Firefox和Chrome上测试过)