Can someone look at this div layout issue im having with IE6.
Stylesheet:
Code: Select all
<style>
body
{
margin:auto;
text-align:center;
}
#page
{
margin:auto;
text-align:center;
width:800px;
height:200px;
}
div.box1
{
width:180px;
height:200px;
float:left;
margin-right:26px;
}
div.topLeft
{
padding:0px;
margin:0px;
width:15px;
height:14px;
float:left;
background-image:url('Images/travel_top_left.gif');
}
div.top
{
padding:0px;
margin:0px;
width:150px;
height:14px;
float:left;
background-image:url('Images/travel_top.gif');
background-repeat:repeat-x;
}
div.topRight
{
padding:0px;
margin:0px;
width:15px;
height:14px;
float:left;
background-image:url('Images/travel_top_right.gif');
}
div.left
{
width:15px;
height:160px;
float:left;
background-image:url('Images/travel_left.gif');
background-repeat:repeat-y;
}
div.center
{
height:100px;
width:90px;
float:left;
background-color:#ac3996;
}
div.topRow
{
display:block;
clear:left;
float:left;
}
div.middleRow
{
display:block;
clear:left;
float:left;
}
div.bottomRow
{
clear:left;
float:left;
}
div.right
{
width:15px;
height:160px;
float:left;
background-image:url('Images/travel_right.gif');
background-repeat:repeat-y;
}
</style>Code: Select all
<div id="page">
<div class="box1">
<div class="topRow">
<div class="topLeft"><!-- --></div>
<div class="top"><!-- --></div>
<div class="topRight"><!-- --></div>
</div>
<div class="middleRow">
<div class="left"><!-- --></div>
<div class="center">hghghghghghg</div>
<div class="right"><!-- --></div>
</div>
</div>
</div>