diff options
Diffstat (limited to 'site/content/docs/5.3/helpers')
-rw-r--r-- | site/content/docs/5.3/helpers/stacks.md | 4 | ||||
-rw-r--r-- | site/content/docs/5.3/helpers/vertical-rule.md | 8 |
2 files changed, 10 insertions, 2 deletions
diff --git a/site/content/docs/5.3/helpers/stacks.md b/site/content/docs/5.3/helpers/stacks.md index 2be6b30..caa2c67 100644 --- a/site/content/docs/5.3/helpers/stacks.md +++ b/site/content/docs/5.3/helpers/stacks.md @@ -42,7 +42,7 @@ Using horizontal margin utilities like `.ms-auto` as spacers: {{< example class="bd-example-flex" >}} <div class="hstack gap-3"> <div class="p-2">First item</div> - <div class="p-2">Second item</div> + <div class="p-2 ms-auto">Second item</div> <div class="p-2">Third item</div> </div> {{< /example >}} @@ -52,7 +52,7 @@ And with [vertical rules]({{< docsref "/helpers/vertical-rule" >}}): {{< example class="bd-example-flex" >}} <div class="hstack gap-3"> <div class="p-2">First item</div> - <div class="p-2">Second item</div> + <div class="p-2 ms-auto">Second item</div> <div class="vr"></div> <div class="p-2">Third item</div> </div> diff --git a/site/content/docs/5.3/helpers/vertical-rule.md b/site/content/docs/5.3/helpers/vertical-rule.md index 334eb3e..130f97b 100644 --- a/site/content/docs/5.3/helpers/vertical-rule.md +++ b/site/content/docs/5.3/helpers/vertical-rule.md @@ -43,3 +43,11 @@ They can also be used in [stacks]({{< docsref "/helpers/stacks" >}}): <div class="p-2">Third item</div> </div> {{< /example >}} + +## CSS + +### Sass variables + +Customize the vertical rule Sass variable to change its width. + +{{< scss-docs name="vr-variables" file="scss/_variables.scss" >}} |