Merhaba arkadaşlar.Css position fixed ve absolute değerleriyle alakalı bi sorunum var ve bi türlü içinden çıkamıyorum.

Sorun şöyle
İki tane div alanı var."alan1" isimli div alanı css kodlarındanda görüldüğü gibi position:fixed koduyla footer bölümüne sabitlenmiş bir şekilde duruyor.Bu div alanının içerisinde bulunan "alan2" kısmını ise position:absolute; yazarak sayfanın en üstünde konumlandırmaya çalışıyorum ancak ne yaptıysam alan1 dışına çıkmıyor.

"alan1" isimli divdeki position:fixed; kodunu kaldırınca alan2 istediğim şekli alıyor ancak ben her ikisininde olmasını istiyorum.

Div alanları

<div class="alan1">
<div class="alan2"></div>
</div>

Css kodları

<STYLE type=text/css>
.alan1{z-index:1;position:fixed;width:100%;height:50px;bottom:0px;left:0px;background:#000;overflow:hidden;color:#fff;}
.alan2{z-index:2;position:absolute;top:0px;left:0px;height:50px;width:50px;background:#333;}
</STYLE>