...

View Full Version : Alert the media! IE is getting this positioning correct, not FF



TripperTreats
11-09-2006, 04:30 PM
OK, so I bought into this discussion I read that you shouldn't use tables for layout, despite the fact that it was extremely simple and did exactly what I want (www.trippertreats.com) (http://www.trippertreats.com%29).

Ok fine. So now I'm just using divs and CSS, which I'm finding much less intuitive and more cumbersome. I'm sure there is a simple answer as I'm new to CSS, but why does the banner at the top of my page not stretch out in FF, but it does in IE? (www.trippertreats.com/test.html (http://www.trippertreats.com/test.html)) Do I have to write "width = 100%" twice to tell FF I really mean it? Here is the CSS:

body {
margin: 0 auto;
text-align: center;
overflow: auto;
}
#leftDiv {
position: relative;
width: 200px;
float: left;
overflow: auto;
}
#leftDiv #windowDiv {
position: relative;
width: 200px;
height: 125px;
}
#leftDiv #buttonsDiv {
position: relative;
width: 200px;
height: 500px;
}
#rightDiv {
position: relative;
margin: 0 auto;
float: left;
overflow: auto;
}
#rightDiv #titleDiv {
position: relative;
margin: 0 auto;
height: 125px;
width: 100%;
}
#rightDiv #mainDiv {
position: relative;
margin: 0 auto;
width: 100%;
}
#footerDiv {
position: relative;
margin: 0 auto;
clear: left;
width: 100%;
text-align: right;
overflow: auto;
}
and here is the basic content:


<body>

<div id="leftDiv">
<div id="windowDiv">stuff</div>
<div id="buttonsDiv">stuff</div>
<img id="payPalImage"/>
</div>

<div id="rightDiv">
<div id="titleDiv">stuff</div>
<div id="mainDiv">stuff</div>
</div>

<div id="footerDiv">stuff</div>

<script type="text/javascript">
var swfWindow = new SWFObject("/FlashFiles/Window.swf", "windowFlash", "100%", "100%", "8", "#FFFFFF");
swfWindow.addParam("wmode", "transparent");
swfWindow.addParam("scale", "exactfit");
swfWindow.write("windowDiv");

var swfTitle = new SWFObject("/FlashFiles/Title.swf", "titleFlash", "100%", "100%", "8", "#FFFFFF");
swfTitle.addParam("wmode", "transparent");
swfTitle.addParam("scale", "exactfit");
swfTitle.write("titleDiv");

var swfButtons = new SWFObject("/FlashFiles/Buttons.swf", "buttonsFlash", "100%", "100%", "8", "#FFFFFF");
swfButtons.addParam("wmode", "transparent");
swfButtons.addParam("scale", "exactfit");
swfButtons.write("buttonsDiv");
</script>
</body>
Thanks for any help!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum