Consider CSS `gap` utilities as a replacement for gutter classes
Nobody has claimed this yet.
- Dominant language
- MDX
- Stars
- 175k
- Forks
- 78.6k
- Avg merge
- 7h 19m
- Merged PRs (30d)
- 35
Description
Bootstrap 5 handled the spacing between grid columns with gutter classes (.g-*, .gx-*, .gy-*). Now that the CSS gap property is well supported, it may be worth replacing those classes with gap-based utilities, or offering both.
We should weigh the trade-offs, settle on a direction, and — if we move to gap — document the migration path for people coming from the gutter classes.
The grid styles are in scss/layout/_grid.scss, where a // TODO: comment marks the spot. Once this is resolved, that comment can be removed.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start in scss/layout/_grid.scss at the marked TODO and review how the existing .g-, .gx-, and .gy-* gutter classes work. Compare the trade-offs of replacing them with CSS gap utilities versus offering both, then define the migration guidance for existing users. Done means the direction is settled, the migration path is documented if needed, and the TODO is removed.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- bootstrap, css, scss
- Domain
- frontend, web-dev
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100