Skip to main content

Z Index

Set z-index

Overview #

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

Examples #


<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