Is there a way to set a single grid-row-gap
to specific size that is different from the rest of the grid?
Use case: the top row of the grid should have less of a gap to the second row than the rest of the grid as it acts as a header.
The grid-row-gap
and grid-column-gap
properties apply to the entire grid (spec reference).
However, you can use negative margins on the second row grid items to adjust their position.
Another option would be to remove the top row (headers) from the current grid and place it in a different container directly above the data. This would eliminate the grid-gap
problem.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With