所以我有这个网格:
+---------+------------------------------+---------+ | <div> | <p> - 1000 characters long | <div> | +---------+------------------------------+---------+
里面p有没有空格的超长字符串。divs是具有固定尺寸的占位符。这将产生以上结果:
p
div
display: grid; grid-auto-flow: column; grid-template-columns: auto minmax(0, 1fr) auto;
但是更改minmax(0, 1fr)为1fr:
minmax(0, 1fr)
1fr
+---------+----------------------------------------+ | <div> | <p> - 1000 characters long | <div> | +---------+----------------------------------------+
它溢出其父级,超出屏幕大小。为什么它的行为不像minmax?
因为默认情况下1fr与等效minmax(auto, 1fr)。
minmax(auto, 1fr)
使用时minmax(0, 1fr),这与standalone有所不同 1fr。
在第一种情况下,轨道不能小于网格项目的大小( 最小 大小为auto)。
auto
在第二种情况下,轨道可以自由调整为0的宽度/高度。