Z-index

Use our low-level z-index utilities to quickly change the stack level of an element or component.

Examples

z-3
z-2
z-1
z-0
z-n1
vue
<template>
 <b-div
  z="3"
  position="absolute"
  padding="5"
  rounded="3"
 >
  <b-span position="absolute">
   z-3
  </b-span>
 </b-div>
 <b-div
  z="2"
  position="absolute"
  padding="5"
  rounded="3"
 >
  <b-span position="absolute">
   z-2
  </b-span>
 </b-div>
 <b-div
  z="1"
  position="absolute"
  padding="5"
  rounded="3"
 >
  <b-span position="absolute">
   z-1
  </b-span>
 </b-div>
 <b-div
  z="0"
  position="absolute"
  padding="5"
  rounded="3"
 >
  <b-span position="absolute">
   z-0
  </b-span>
 </b-div>
 <b-div
  z="n1"
  position="absolute"
  padding="5"
  rounded="3"
 >
  <b-span position="absolute">
   z-n1
  </b-span>
 </b-div>
</template>