CSS 2.1 Reference: z-index Property

The z-index property is used to set the element's stacking order. If multiple element boxes overlap then the value of this property is used to determine which one is displayed on top. Element boxes with higher z-index numbers are displayed on top of element boxes with lower z-index numbers.

This property is specified by using an integer or keyword according to the syntax shown above.

CSS Example: The z-index properties are set for 3 different overlapping images which are absolutely positioned.

  #tst1 {z-index: 3; position: absolute; top: 0px; left: 200px;}
  #tst2 {z-index: 4; position: absolute; top: 40px; left: 240px;}
  #tst3 {z-index: 2; position: absolute; top: 20px; left: 280px;}

• auto - The stack level is 0.
• inherit - The inherit keyword is used to specify that the value for this property should be taken from the parent element. If inherit is used with the root element, then the initial value for this property will be used.