Position etiketi bu html dosyasında bir işe yaramıyor. Position'u ben katmanlama yapmak için ve bağımsız margin vermek için kullanıyorum: Örnek: r10 logosunun altında h1 etiketi ike r10 yazacağım yazı ile ve zemin rengi ile aynı yapıp gözle görünmesini engelleicem ki arama motoru açısından iyi birşeydir h1 ile başlığı yazmak.
Bir div'in içine h1 ile r10 ve img olarak logoyu koyalım ve logoyu h1'in üstüne getirelim.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9" />
<title>Bulutto - Örnek</title>
<style type="text/css">
body {font-family:arial, tahoma, verdana, sans-serif;font-size:12px; }
#header {width:1100px; height:200px; position: relative; border:1px solid #666; background:#fff; color:#fff; position:relative; }
#header h1 { font-weight:normal; font-size:12px; }
#header img { position:absolute; left:0; top:0; }
</style>
</head>
<body>
<div id="header">
<h1>Header</h1>
<img src="r10.png">
</div>
</body>
</html>Yukardaki örnekte logo h1 etiketini kapatmış oluyor; ama hala neden header'a position:relative; verdiğimi tama anlatamamış olabilirim: position relative vermeseydim eğer logomuz body etiketini baz alıcaktı, yani atıyorum biz header'a relative tanımı yapmasaydık ve header'a margin-top:100px; deseydik logo en üstte kalacaktı aşağı kaymıcaktı, ama bu şekilde margin verirsek logo da kayacak.