I was struggling with some elaborate nested divs,
and my styles were working fine on everything (even Mac/ie5.2)
*except* IE6.0 on Windows 2000 professional.
I have 2 nested DIVS, both float-lefted.
The inner one has a small border and a large margin.
On viewing, the upper, left and right margins
of the inner div are honoured, but the bottom
is COMPLETELY IGNORED!
Since the HTML (and styles) is tiny, here it is:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Funny margin behaviour</title>
<style type="text/css" media="screen">
body {
}
div.outer {
float:left;
background: blue;
border: 1px solid green;
}
div.inner {
float:left;
background: yellow;
margin: 50px;
border: 1px solid red;
}
</style>
</head>
<body>
<div class="outer">
<div class="inner">
hello world
</div>
</div>
</body>
</html>
I have carefully checked
http://www.quirksmode.org/
and
http://www.hut.fi/u/hsivonen/doctype.html
and read
http://www.w3.org/TR/REC-CSS2/cover.html#minitoc
VERY careful, and I think my HTML is Valid.
Is this a known bug, or have I made
some horrendous oversight?
If it *is* a bug, I would welcome (understatement)
any workrounds...
BugBear