• 
• 1. SitePoint
  2. Reference
  3. CSS
  4. Layout Properties
  5. z-index
  6. CSS Live Demo: z-index (this page)
• See also: All Live Demos

CSS Live Demo: z-index

Type your CSS here: (any properties allowed except expression, behavior and @import) #warning { position:absolute; z-index:1; } #warning { left:80px; top:10px; background:#fcc; border:2px solid red; width:200px; height:200px; } #message { position:absolute; z-index:0; left:10px; top:40px; background:#cef; border:2px solid blue; width:300px; height:100px; }

Type your HTML here: (any tags allowed except script, iframe, frame, object, img and embed) <div id="warning">Warning!</div> <div id="message">Message</div>

Show me!

Your results appear here: