Conversation
github-project-automation
bot
moved this to In Progress / Draft
in 🟣 [Orange-Boosted-Bootstrap] PRs Board
✅ Deploy Preview for boosted ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
…e-to-edge-grid-security-margin-and-gutter
boosted-bot
moved this from In Progress / Draft
to Need Dev Review
in 🟣 [Orange-Boosted-Bootstrap] PRs Board
vprothais
reviewed
Feb 20, 2026
|
|
||
| ### Edge to edge containers | ||
|
|
||
| The negative `gridmargin` `margin` utility can be used to create edge to edge containers, the following example creates an edge to edge container on the smaller breakpoints. |
Collaborator
There was a problem hiding this comment.
Maybe we could add that the availability of this helper doesn't depend on the value of $enable-negative-margins ?
Collaborator
Author
There was a problem hiding this comment.
Added 2 callouts, lmk if it's ok
|
|
||
| The negative `gridmargin` `margin` utility can be used to create edge to edge containers, the following example creates an edge to edge container on the smaller breakpoints. | ||
|
|
||
| <div class="mx-ngridmargin mx-md-none py-small px-md-small px-gridmargin mb-small" style="background-color: rgba(var(--bd-primary-light-rgb), 0.15);">Edge to edge container on smaller breakpoints</div> |
Collaborator
There was a problem hiding this comment.
The left menu is also hidden in large viewport, we could have the edge to edge on large screen too. Easier to test with the browser while keeping the content readable. WDYT ?
Suggested change
| <div class="mx-ngridmargin mx-md-none py-small px-md-small px-gridmargin mb-small" style="background-color: rgba(var(--bd-primary-light-rgb), 0.15);">Edge to edge container on smaller breakpoints</div> | |
| <div class="mx-ngridmargin mx-lg-none py-small px-lg-small px-gridmargin mb-small" style="background-color: rgba(var(--bd-primary-light-rgb), 0.15);">Edge to edge container on smaller breakpoints</div> |
The code example underneath should be updated too if we keep this change.
…e-to-edge-grid-security-margin-and-gutter
vprothais
approved these changes
Feb 20, 2026
boosted-bot
moved this from Need Dev Review
to Need Lead Dev Review
in 🟣 [Orange-Boosted-Bootstrap] PRs Board
vprothais
deleted the
oud/main-ml-add-spacing-helpers-for-edge-to-edge-grid-security-margin-and-gutter
branch
github-project-automation
bot
moved this from Need Lead Dev Review
to Done
in 🟣 [Orange-Boosted-Bootstrap] PRs Board
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Types of change
Related issues
Closes #3314
Context & Motivation
We need a way to create edge-to-edge containers
Description
Add grid margin (-gridmargin) and grid gap (-gridgap) scaled spacings utilities (padding, margin and gap)
Checklists
Checklist (for Core Team only)
Progression (for Core Team only)
ouds/mainfollowing conventional commitLive previews