Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / css2.1 / t090501-c414-flt-00-d.html
blobb86047dba7106ddf14082b799f33d8b6e487805b
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
2 <html>
3 <head>
4 <title>CSS 2.1 Test Suite: Floating Elements</title>
5 <style type="text/css">
6 p { color: navy; }
7 .test div { margin: 1em; padding: 0 0 0.5em; border: 0.5em solid; border-bottom: none; background: navy; color: blue; }
8 .test p { width: 10em; padding: 0.25em; margin: 0; border: 0.25em solid; background: teal; color: aqua; }
9 .test p.left { float: left; }
10 .test p.right { float: right; }
11 </style>
12 <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#float-position" title="9.5.1 Positioning the float: the 'float' property">
13 </head>
14 <body>
15 <p>In the following test, the teal blocks must be just inside the
16 top and sides of the blue rectangle.</p>
17 <div class="test">
18 <div>
19 <p class="left"> Teal block. Teal block. Teal block. Teal block. Teal block. Teal block. Teal block. Teal block. </p>
20 <p class="right"> Teal block. Teal block. Teal block. Teal block. Teal block. Teal block. Teal block. Teal block. </p>
21 Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle.
22 Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle. Blue rectangle.
23 </div>
24 </div>
25 </body>
26 </html>