diff options
| author | XhmikosR <[email protected]> | 2021-09-07 21:49:51 +0300 |
|---|---|---|
| committer | GitHub <[email protected]> | 2021-09-07 21:49:51 +0300 |
| commit | 65413de3131294cbf7bc8bff94914cc8062149c6 (patch) | |
| tree | d606f927ef9d5e505245b0fce29366979d219f83 /site/content/docs/5.0/layout/z-index.md | |
| parent | 72e79d0e3997c3a850263880240f26684b9784f7 (diff) | |
| parent | 0d81d3cbc14dfcdca8a868e3f25189a4f1ab273c (diff) | |
| download | bootstrap-docs-offcanvas-navbar.tar.xz bootstrap-docs-offcanvas-navbar.zip | |
Merge branch 'main' into docs-offcanvas-navbardocs-offcanvas-navbar
Diffstat (limited to 'site/content/docs/5.0/layout/z-index.md')
| -rw-r--r-- | site/content/docs/5.0/layout/z-index.md | 16 |
1 files changed, 0 insertions, 16 deletions
diff --git a/site/content/docs/5.0/layout/z-index.md b/site/content/docs/5.0/layout/z-index.md deleted file mode 100644 index 1870d05d2..000000000 --- a/site/content/docs/5.0/layout/z-index.md +++ /dev/null @@ -1,16 +0,0 @@ ---- -layout: docs -title: Z-index -description: While not a part of Bootstrap's grid system, z-indexes play an important part in how our components overlay and interact with one another. -group: layout ---- - -Several Bootstrap components utilize `z-index`, the CSS property that helps control layout by providing a third axis to arrange content. We utilize a default z-index scale in Bootstrap that's been designed to properly layer navigation, tooltips and popovers, modals, and more. - -These higher values start at an arbitrary number, high and specific enough to ideally avoid conflicts. We need a standard set of these across our layered components—tooltips, popovers, navbars, dropdowns, modals—so we can be reasonably consistent in the behaviors. There's no reason we couldn't have used `100`+ or `500`+. - -We don't encourage customization of these individual values; should you change one, you likely need to change them all. - -{{< scss-docs name="zindex-stack" file="scss/_variables.scss" >}} - -To handle overlapping borders within components (e.g., buttons and inputs in input groups), we use low single digit `z-index` values of `1`, `2`, and `3` for default, hover, and active states. On hover/focus/active, we bring a particular element to the forefront with a higher `z-index` value to show their border over the sibling elements. |
