1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2 <html>
3 <head>
4 <title>CSS Test: Height determination for block-level non-replaced elements in normal flow when 'overflow' computes to 'visible' and elements' margins do not collapse</title>
5 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
6 <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#normal-block">
7 <meta name="flags" content="">
8 <meta name="assert" content="When a block-level non-replaced element is in normal flow, 'overflow' computes to 'visible', the 'height' is 'auto' and top and bottom margins do not collapse. The 'height' is the sized from the top of the topmost margin edge of the content to the bottom of the bottom most margin edge of the content.">
9 <style type="text/css">
10 #div1
11 {
12 position: relative;
13 }
14 #div2
15 {
16 background: blue;
17 border-bottom: 0.25in solid blue;
18 border-top: 0.25in solid blue;
19 }
20 #div2, #div3, #div4, #div5
21 {
22 width: 1in;
23 }
24 #div3, #div4
25 {
26 background: blue;
27 height: 0.25in;
28 }
29 #div3
30 {
31 border-top: 0.25in solid blue;
32 margin-top: 0.25in;
33 }
34 #div4
35 {
36 border-bottom: 0.25in solid blue;
37 margin-bottom: 0.25in;
38 }
39 #div5
40 {
41 background: blue;
42 height: 2in;
43 left: 1in;
44 position: absolute;
45 top: 0;
46 }
47 </style>
48 </head>
49 <body>
50 <p>Test passes if there is a blue square below.</p>
51 <div id="div1">
52 <div id="div2">
53 <div id="div3"></div>
54 <div id="div4"></div>
55 </div>
56 <div id="div5"></div>
57 </div>
58 </body>
59 </html>