haha, no you were right the first time, i can't figure out why its
dropping in ie. i've set up another one at
http://footstops.dev01.alkaloid.net/test3.php that is super simple and
should illustrate my problem. In ie, when you reduce the width of the
browser, the bannerad will drop as its not a variable width like the
other two. in FF it hides tho, IE it drops.
It's dropping because of how ie handles the float property, which you
have applied to #map. After trying a few things I think that without
better support for the display:inline-block; property what you're doing
isn't practical at the moment, cross-browser.
I put together this little hack to figure out whether it has the
properties that you *want* the page to have. I wouldn't suggest using
it because it'll break on loads of different display types. AND it's
all in absolute dimensions. This is just to make sure I'm on the same
page as you (so to speak).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style media="screen" title="Main CSS" type="text/css">
/* CSS Document */
/* Ad divs */
body {margin-top:8px;}
#bannerAd {
border: 1px solid orange;
padding: 0px;
width: 100px;
height: 50px;
position:absolute;
left:370px;
top:35px;
}
#map {
width: 350px;;
height: 300px;
border: 1px dashed green;
}
#userBlock {
border: 1px dashed blue;
padding: 0;
width:645px;
position:absolute;
left:370px;
top:8px;
}
#blog {
border: 1px dashed red;
padding: 0;
width:645px;
position:absolute;
left:370px;
top:90px;
}
</style>
</head>
<body>
<div id="map">map</div>
<div id="userBlock">userblock</div>
<div id="bannerAd">bannerad</div>
<div id="blog">blog</div>
</body>
</html>
