7 {{ upvoteCount | shortNum }}
7 {{ upvoteCount | shortNum }}

Help with float/absolute divs in ie6

by Ryan_Taylor
5 replies
  • WEB DESIGN
    • |
I've got a very simple landing page that does not display properly in IE6. The "absolute div" is pushed to the right of the "center div" when it shouldn't be. If I remove the floats, the absolute div displays fine, but I'm using "float left" to align the 3 divs right next to each other.

Everything looks fine in FF, IE8, Safari, etc. Just can't get older versions of IE to work.

Can anyone good with CSS help me figure out how to fix this?

Thanks!

Code:
<style type="text/css">
<!--
body {
    background-color: #372d2b;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
}
#container {
    width: 800px;
    margin-right: auto;
    margin-left: auto;
    height: 550px;
    padding: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}
#button {
    position: absolute;
    padding-top: 295px;
    height: 119px;
    width: 418px;
    padding-left: 75px;
}
#left {
    float: left;
}
#center {
    float: left;
}
#right {
    height: 416px;
    }
-->
</style>
</head>

<body>
<div id="container">
<div id="button"><a href="go.php"><img src="images/button.jpg" width="418" height="119" border="0" /></a></div>
<div id="left"><img src="images/left_panel.jpg" width="199" height="416" /></div>
<div id="center"><img src="images/center_panel.jpg" width="302" height="416" /></div>
<div id="right"><img src="images/right_panel.jpg" width="299" height="416" /></div>
</div>
</body>
#divs #float or absolute #ie6

Trending Topics