Skip to content

[css-grid] Possibility of having gaps only on specific columns/rows #5056

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
huijing opened this issue May 9, 2020 · 1 comment
Closed

Comments

@huijing
Copy link
Contributor

huijing commented May 9, 2020

While attempting to recreate the design in the image below, there is a column of content which has a sort of margin between itself and its adjacent column. However, there are no other such column gaps in the rest of the design. Currently, I would add an empty track for that purpose but wondered if there was a possibility of having grid gaps only on specific columns or rows.

overlay-2

The most related issues I can find are #1659 and maybe #2748, because the W3C discussion log mentions the consideration required for items that span across gaps, which is evident in the image example above.

Gap is currently defined in CSS Box Alignment Module Level 3 (https://www.w3.org/TR/css-align-3/#gaps).

@MatsPalmgren
Copy link

This is already covered by #1659 isn't it? You could do the above design with column-gap: repeat(3,0) 1em repeat(auto-fill,0) for example, right?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants