<html>
<body>
<div id="container">
<div id="first"></div>
<div id="second"></div>
</div>
</body>
</html>
html, body{margin:0; height:100%;}. И все потому, что высота будет 0, а overflow:hidden скроет все что за контейнером (но если бы мы не указали контейнеру position:relative;, то абсолютные дивы позиционировались в body и были бы видны). Если вам все же надо, что бы контейнер подстраивался под детей, то абсолютное позиционирование не подойдет. Вам бы поподробнее описать проблему и желаемый результат. 
.container {
background-color: grey;
height: 100%;
overflow: hidden;
position: relative;
width: 200px;
}
.first {
left: 10px;
position: absolute;
top: 10px;
}
.second {
left: 20px;
position: absolute;
top: 400px;
}
z-index’ом можно не только при абсолютном (position: absolute), но и при относительном (position: relative) позиционировании.
Простой
Средний
Средний
