exposing float-margins and float-dimensions

lead margin in percentage - with and without element-dimensions...

chaotic test page
#16
01.apr.2006

1: floating div following floating div

2: floating img following floating img

3: floating img following floating img - no dimensions given on rightmost float

.independent {
overflow: hidden; 
height: 100px; 
width: 99%; 
border: solid 1px #fff;
}

.float0 {
float: left; 
margin: 5px -300px 0 5px; 
clear: left; 
height: 90px; 
width: 400px; 
background: #dce;
}

.float1 {
float: left; 
margin: 15px 0 -10px 25%; 
height: 70px; 
width: 200px; 
background: #edc;
}
.float2 {
float: left; 
margin: 15px 0 -10px 25%; 
height: 70px; 
width: 200px; 
background: #edc;
}
.float3 {
float: left; 
margin: 15px 0 -10px 25%; 
background: #edc;
}

Notes:

Gecko browsers are a bit lost...

tested browsers:

Opera:
win2K: 9tp2
- 1: ok
- 2: ok
- 3: ok
Mac OS-X: 7.54
- 1: ok
- 2: ok
- 3: ok
Mozilla:
win2K: 1.7.12
- 1: ok
- 2: ok
- 3: fails
Firefox:
win2K: 1.5.0.1
- 1: ok
- 2: ok
- 3: fails
Mac OS-X: 1.0
- 1: ok
- 2: ok
- 3: fails
Safari:
Mac OS-X: 1.2.4
- 1: ok
- 2: ok
- 3: ok
IE:
win2K: 6.0
- 1: fails (margin-doubling bug)
- 2: ok
- 3: ok
Mac OS-X: 5.2
- 1: ok
- 2: ok
- 3: ok
Netscape (Moz):
win2K: 7.2(Moz 1.7.2)
- 1: ok
- 2: ok
- 3: fails

go to test-menu