Reviewed by Maciej.
[WebKit-https.git] / LayoutTests / css2.1 / t0905-c5525-fltwidth-00-c-g.html
2 <html>
3  <head>
4   <title>CSS 2.1 Test Suite: float</title>
5   <style type="text/css">
6    p { color: navy; font-size: 2em; margin: 1em; }
7    div { text-align: justify; }
8    p.end { text-align: right; }
9    .float { float: left; width: 50%; background: blue; color: white; font-variant: small-caps; }
10    .flow { color: silver; background: url(support/ruler-h-50%25.png) bottom center no-repeat; }
11   </style>
12   <link title="9.5 Floats" href="" rel="help">
13   <link title="10.2 Content width: the 'width' property" href="" rel="help">
14  </head>
15  <body>
16   <!-- This test sucks. -->
17   <p>⇩ The following blue box should be exactly half the width
18   of the viewport, on the left of the 50% ruler mark.</p>
19   <div class="float">
20    ignore this float text ignore this float text ignore this float
21    text ignore this float text ignore this float text ignore this
22    float text ignore this float text ignore this float text ignore
23    this float text ignore this float text ignore this float text
24    ignore this float text ignore this float text ignore this float
25    text ignore this float text ignore this float text ignore this
26    float text ignore this float text ignore this float text ignore
27    this float text ignore this float text ignore this float text
28    ignore this float text ignore this float text ignore this float
29    text ignore this float text ignore this float text ignore this
30    float text ignore this float text ignore this float text ignore
31    this float text ignore this float text ignore this float text
32    ignore this float text ignore this float text ignore this float
33    text ignore this float text ignore this float text ignore this
34    float text ignore this float text ignore this float text ignore
35    this float text ignore this float text ignore this float text
36    ignore this float text ignore this float text ignore this float
37   </div>
38   <div class="flow">
39    this is some dummy text this is some dummy text this is some dummy
40    text this is some dummy text this is some dummy text this is some
41    dummy text this is some dummy text this is some dummy text this is
42    some dummy text this is some dummy text this is some dummy text
43    this is some dummy text this is some dummy text this is some dummy
44    text this is some dummy text this is some dummy text this is some
45    dummy text this is some dummy text this is some dummy text this is
46    some dummy text this is some dummy text this is some dummy text
47    this is some dummy text this is some dummy text this is some dummy
48    text this is some dummy text this is some dummy text this is some
49    dummy text this is some dummy text this is some dummy text this is
50    some dummy text this is some dummy text this is some dummy text
51    this is some dummy text this is some dummy text this is some dummy
52    text this is some dummy text this is some dummy text this is some
53    dummy text this is some dummy text this is some dummy text this is
54    some dummy text this is some dummy text this is some dummy text
55    this is some dummy text this is some dummy text this is some dummy
56    text this is some dummy text this is some dummy text this is some
57    dummy text this is some dummy text this is some dummy text this is
58    some dummy text this is some dummy text this is some dummy text
59    this is some dummy text this is some dummy text this is some dummy
60    text this is some dummy text this is some dummy text this is some
61    dummy text this is some dummy text this is some dummy text this is
62    some dummy text this is some dummy text this is some dummy text
63    this is some dummy text this is some dummy text this is some dummy
64    text this is some dummy text this is some dummy text this is some
65    dummy text this is some dummy text this is some dummy text this is
66    some dummy text this is some dummy text
67   </div>
68   <p class="end">The above gray text should flow around the blue box.
69   ⇧</p>
70  </body>
71 </html>