使用该flex-grow
属性可以使弹性项目消耗 主轴上的 可用空间。
此属性将尽可能扩展项目,调整长度以适应动态环境,例如调整屏幕大小或添加/删除其他项目。
常见的示例是flex-grow: 1
或使用缩写属性flex: 1
。
因此,请使用而不是width: 96%
在您的div上flex: 1
。
你写了:
因此,现在将其设置为96%,直到您真正按下屏幕为止,它看起来还可以-右div有点饿了它所需的空间。
固定宽度div的压缩与另一个flex属性有关: flex-shrink
默认情况下,flex项目设置为flex-shrink: 1
使它们能够收缩以防止容器溢出。
要禁用此功能,请使用flex-shrink: 0
。