Forum Moderators: not2easy
The divs are absolute positioned and they all stay I the right place in Safari, Firefox and IE... However:
in IE (and only in IE) at the right side, there is like 25px extra on the whole site!
I don't know if I can post a link to imageshack.us for a picture (without the address in it)?
here is the code:
CSS:body{
background-color: #CDE4EA;
font-family: Arial, Verdana, sans-serif;
font-size: medium;
color: #595441;
min-width: 500px;
}#top {
display:block;
width: 100%;
position: absolute;
padding: 0;
margin: 0;
border-spacing: 0;
border-bottom: 1px black solid;
left: 0px;
top: 0px;
height: 60px;
background: url(images/grey2black.png) repeat-x;
font-size: 35px;
color: black;
vertical-align: 0;
}#menu {
display:block;
width: 100%;
position: absolute;
padding: 0;
margin: 0;
border-spacing: 0;
border-bottom: 1px black solid;
left: 0px;
top: 61px;
height: 25px;
vertical-align: middle;
font-size: small;}
#body {
position: absolute;
top:87px;
left: 0px;
width: 100%;
height: 700px;
overflow-y: scroll;
overflow-x: hidden;
}#footer {
position: absolute;
top: 787px;
left: 0px;
border-top: 1px gray dotted;
width: 100%;
}XHTML:
<!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</title>
<link rel="stylesheet" href="css.css" />
</head><body>
<div id="top">
HEADER
</div>
<div id="menu">
Navigation
</div>
<div id="body">
Site
</div>
<div id="footer">
Foot
</div>
</body></html>
I know IE has a lot of bugs but I don't know how this one is called...
padding: 0;
margin: 0;
:)
It was the IE box bug
It was the IE box bug
Is this IE's 'traditional' box model when rendered in quirks mode (ie. without a valid DOCTYPE)? But you appear to have a valid DOCTYPE - unless you have something else before the DOCTYPE?!
Or is this another kind of IE box bug? Just curious.
