Z Index

Set z-index

Overview #

Use the z-index utilities to set the stacking order of an element.

Examples #

Choose an example

<div class="z-example">
  <div class="rvt-z-1000">
      1000
  </div>
  <div class="rvt-z-900">
      900
  </div>
  <div class="rvt-z-800">
      800
  </div>
  <div class="rvt-z-700">
      700
  </div>
  <div class="rvt-z-600">
      600
  </div>
  <div class="rvt-z-500">
      500
  </div>
  <div class="rvt-z-400">
      400
  </div>
  <div class="rvt-z-300">
      300
  </div>
  <div class="rvt-z-200">
      200
  </div>
  <div class="rvt-z-100">
      100
  </div>
</div>

Usage #

Set an element’s z-index value using the following utility classes:

.rvt-z-100
.rvt-z-200
.rvt-z-300
.rvt-z-400
.rvt-z-500
.rvt-z-600
.rvt-z-700
.rvt-z-800
.rvt-z-900
.rvt-z-1000