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: Floats, shifting down below all other floated elements</title>
5 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
6 <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#floats">
7 <meta name="flags" content="image">
8 <meta name="assert" content="Floated boxes shift down until it fits.">
9 <style type="text/css">
10 #parentDiv
11 {
12 background: red url('support/floats-005.png');
13 width: 1.25in;
14 }
15 div
16 {
17 float: left;
18 }
19 div div
20 {
21 background: green;
22 }
23 #div1
24 {
25 height: 1in;
26 width: 1.2in;
27 }
28 #div2
29 {
30 height: 1in;
31 width: 0.75in;
32 }
33 #div3
34 {
35 height: 0.25in;
36 width: 0.2in;
37 }
38 #div4
39 {
40 width: 0.5in;
41 height: 0.25in;
42 }
43 </style>
44 </head>
45 <body>
46 <p>Test passes if there is no red visible on the page.</p>
47 <div id="parentDiv">
48 <div id="div1"></div>
49 <div id="div2"></div>
50 <div id="div3"></div>
51 <div id="div4"></div>
52 </div>
53 </body>
54 </html>