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