Z-indeks

Flere Bootstrap-komponenter bruker z-index, CSS-egenskapen som hjelper til med å kontrollere layout ved å tilby en tredje akse for å arrangere innhold. Vi bruker en standard z-indeksskala i Bootstrap som er utformet for riktig lagnavigasjon, verktøytips og popovers, modaler og mer.

Disse høyere verdiene starter på et vilkårlig tall, høye og spesifikke nok til å ideelt sett unngå konflikter. Vi trenger et standardsett med disse på tvers av de lagdelte komponentene våre – verktøytips, popovers, navbarer, rullegardiner, modaler – slik at vi kan være rimelig konsekvente i oppførselen. Det er ingen grunn til at vi ikke kunne ha brukt 100+ eller 500+.

Vi oppfordrer ikke til tilpasning av disse individuelle verdiene; bør du endre en, må du sannsynligvis endre dem alle.

$zindex-dropdown:                   1000;
$zindex-sticky:                     1020;
$zindex-fixed:                      1030;
$zindex-modal-backdrop:             1040;
$zindex-offcanvas:                  1050;
$zindex-modal:                      1060;
$zindex-popover:                    1070;
$zindex-tooltip:                    1080;

For å håndtere overlappende grenser innenfor komponenter (f.eks. knapper og innganger i inngangsgrupper), bruker vi lave enkeltsifrede z-indexverdier på 1, 2, og 3for standard, hover og aktive tilstander. På hover/fokus/aktiv bringer vi et bestemt element i forgrunnen med en høyere z-indexverdi for å vise grensen deres over søskenelementene.