Como deixo a div #inner-block
em primeiro plano?
#block-1
{
position: absolute;
width: 200px;
height: 200px;
top: 10px;
left: 10px;
background-color: #999;
z-index: 1;
}
#inner-block
{
position: relative;
width: 100px;
height: 100px;
margin: 20px;
background-color: #777;
z-index: 100;
}
#block-2
{
position: absolute;
width: 200px;
height: 200px;
top: 60px;
left: 60px;
background-color: #666;
z-index: 2;
}
<div id="block-1"><div id="inner-block"></div></div>
<div id="block-2"></div>
#block-1
com z-index maior que o#block-2
, ou seja, de 3 ou mais.div
block-2
ficaria a meio das outras duas, apesar de ser um elemento que não se relaciona com elas no html ? Parece ser um problema estrutural