Re: [csswg-drafts] [css-align][css-grid] Suggestion: Flexible Grid Gaps (#6275)

Just wanted to mention a case that `justify-content` does not cover: we could want to limit the amount of space distributed. Imagine we would have something like `gap: clamp(1rem, 1fr, 5rem)` — this could work similarly to having a gap + having a justify-content, where the gaps would try to use the remaining space, but could increase to max of 5rem.

Link to a mastodon thread by @matuzo where I saw a case that could benefitted from the `fr` for gaps: https://front-end.social/@matuzo/110236145041434483

The only workaround for this that I found involves adding extra elements that would be used instead of the gaps — https://codepen.io/kizu/pen/gOBLyRR?editors=1100

Video showing how this works in action:

https://user-images.githubusercontent.com/177485/233620596-2533b6a3-a50b-4a04-ba7c-1f0d03cfe74c.mov




-- 
GitHub Notification of comment by kizu
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6275#issuecomment-1517658142 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 21 April 2023 11:04:41 UTC