Fark aslında şundan kaynaklanıyor: width:100% dedikten sonra yazdığınız margin, padding değerleri dıştaki divler taşmasina yol açıyor IE7 ve
Firefox'ta olduğu gibi (hatti altta scrollbar cikiyor bu yuzden). IE6 ise divler taşmasın diye genişletme yapıyor. Bu durumda hem IE7 hem
Firefox ( hem opera ) icin farklı kod yazmaktansa sadece IE6 ya yönelik conditinal comment kulanmak mumkün. Ama zaten çok karmaşık bir yapı yok, o yuzden hepsinde çalışacak ortak kod yazmak daha iyi olur:
Kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml-strict.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml" XML:lang="en">
<head>
<title>Untitled Page</title>
<style type="text/CSS" media="screen">
*{
margin:0;
padding:0;
}
.clear{
clear:both;
background-color: #333;
}
#grikutu{
border: #d1d3be 1px solid;
padding: 10px;
background: #eaebee;
}
#grikutu1{
float: left;
border: #d1d3be 1px solid;
width:500px;
background: #ffffff;
margin-right: 10px;
}
#grikutu1_{
padding: 10px;
margin: 3px;
border: #e6e7da 1px solid;
height:372px;
background: #F4F4ED;
}
#grikutu2{
float:left;
border: #d1d3be 1px solid;
width:205px;
background: #ffffff;
}
#grikutu2_{
padding: 10px;
margin: 3px;
border: #e6e7da 1px solid;
height:372px;
background: #f4f4f6
}
</style>
</head>
<body>
<div id="grikutu">
<div id="grikutu1">
<div id="grikutu1_">
Veriler..
</div>
</div>
<div id="grikutu2">
<div id="grikutu2_">
Veriler..
</div>
</div>
<div class="clear"></div>
</div>
</body>
</HTML>
#grikutu divinin height:100%ile sayfayi kaplamasi icin:
Kod:
HTML,body {height:100%;}