HTML.it - Guida CSS di base - La proprietà z-index

Impostare l'ordine degli elementi posizionati

>> Leggi di più su Z-index nella guida CSS

<div class="box-1">
<p><code>z-index: 1</code></p>
</div>
<div class="box-2">
<p><code>z-index: 2</code></p>
</div>
<div class="box-3">
<p><code>z-index: 3</code></p>
</div>

.box-1 {
 width: 300px;
 height: 300px;
 padding: 10px;
 border: 1px solid #002c53;
 background: #568ec0;
 position: absolute;
 top: 20px;
 left: 20px;
 z-index: 1;
}
.box-2 {
 width: 300px;
 height: 300px;
 padding: 10px;
 border: 1px solid #002c53;
 background: #568ec0;
 position: absolute;
 top: 60px;
 left: 170px;
 z-index: 2;
}
.box-3 {
 width: 300px;
 height: 300px;
 padding: 10px;
 border: 1px solid #002c53;
 background: #568ec0;
 position: absolute;
 top: 90px;
 left: 290px;
 z-index: 3;
}