问题 对于单个排水沟,是否可以覆盖网格行间隙/夹持柱间隙?


有没有办法设置一个单一的 grid-row-gap 特定尺寸与网格的其他部分不同?

使用案例:网格的顶行与第二行的间隙应少于网格的其余部分,因为它充当标题。


13079
2017-07-17 19:02


起源



答案:


grid-row-gap 和 grid-column-gap 属性适用于整个网格(规范参考)。

但是,您可以在第二行网格项上使用负边距来调整其位置。

另一种选择是从当前网格中删除顶行(标题)并将其放在数据正上方的不同容器中。这将消除 grid-gap 问题。


12
2017-07-17 19:05



谢谢,@ Michael_B。这是我在阅读规范并用Google搜索时的想法。有意义,并且想到了负边缘的想法。现在,我只使用两个具有相同列集的网格。似乎更干净。 - Eric R
对于一行,我需要为第一个元素添加另一个flex div,并用另一个flex div包装所有这些,看起来很hacky。 - shinzou


答案:


grid-row-gap 和 grid-column-gap 属性适用于整个网格(规范参考)。

但是,您可以在第二行网格项上使用负边距来调整其位置。

另一种选择是从当前网格中删除顶行(标题)并将其放在数据正上方的不同容器中。这将消除 grid-gap 问题。


12
2017-07-17 19:05



谢谢,@ Michael_B。这是我在阅读规范并用Google搜索时的想法。有意义,并且想到了负边缘的想法。现在,我只使用两个具有相同列集的网格。似乎更干净。 - Eric R
对于一行,我需要为第一个元素添加另一个flex div,并用另一个flex div包装所有这些,看起来很hacky。 - shinzou