From: Christian Oliff Date: Mon, 6 Sep 2021 18:48:35 +0000 (+0900) Subject: Docs: Add Callout to Stacks Helper page about limited flexbox gap support (#34910) X-Git-Tag: v5.1.1~6 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=6411799e60ed6baa9f47f145c2fe902cc5f5f445;p=thirdparty%2Fbootstrap.git Docs: Add Callout to Stacks Helper page about limited flexbox gap support (#34910) * Docs: Add Callout to Stacks Helper page about limited flexbox gap support Fixes: #34737 * Update stacks.md * Delete callout-warning-flexbox-gap.md Co-authored-by: XhmikosR --- diff --git a/site/content/docs/5.1/helpers/stacks.md b/site/content/docs/5.1/helpers/stacks.md index c1316c3ad5..20ca86aa03 100644 --- a/site/content/docs/5.1/helpers/stacks.md +++ b/site/content/docs/5.1/helpers/stacks.md @@ -8,6 +8,10 @@ toc: true Stacks offer a shortcut for applying a number of flexbox properties to quickly and easily create layouts in Bootstrap. All credit for the concept and implementation goes to the open source [Pylon project](https://almonk.github.io/pylon/). +{{< callout warning >}} +Heads up! Support for gap utilities with flexbox was recently added to Safari, so consider verifying your intended browser support. Grid layout should have no issues. [Read more](https://caniuse.com/flexbox-gap). +{{< /callout >}} + ## Vertical Use `.vstack` to create vertical layouts. Stacked items are full-width by default. Use `.gap-*` utilities to add space between items.