CSS de bir elemente position:absolute verirseniz kendi parent containerinden bağımsız hareket eder. Default olarak belirlenen container <body> dir. Absolute verilen elementin kendi istediğimiz alanda kalması için parent div'e position:relative vermemiz gerekir.
bu şekilde absolute verilen objeyi relative parentin tam ortasına yerleştirmiş oluruz
HTML:
<div class="relative">
<div class="absolute">
</div>
</div>
CSS:
.relative {
position:relative;
width:200px;
height:200px;
background-color:black;
}
.absolute {
position:absolute;
left:0;
right:0;
margin:auto;
width:50px;
height:50px;
background-color:red;
}bu şekilde absolute verilen objeyi relative parentin tam ortasına yerleştirmiş oluruz