c414-flt-wrap-000

Text Not Fitting Beside Non-Replaced Float

WeasyPrint

This browser

Assertion
If a shortened line box is too small to contain any further content, then it is shifted downward until either it fits or there are no more floats present.

Source

 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: Text Not Fitting Beside Non-Replaced Float</title>
 5   <link rel="help" href="http://www.w3.org/TR/REC-CSS1#floating-elements">
 6   <link rel="author" title="CSS1 Test Suite Contributors" href="http://www.w3.org/Style/CSS/Test/CSS1/current/tsack.html">
 7   <link rel="author" title="Ian Hickson" href="mailto:ian@hixie.ch">
 8   <meta name="assert" content="If a shortened line box is too small to contain any further content, then it is shifted downward until either it fits or there are no more floats present.">
 9   <style type="text/css">
10    p { color: navy; }
11    .test { width: 15em; margin: 1em; padding: 0; background: white; color: white; }
12    .test p { margin: 0; padding: 0.01em; }
13    .test p.left { float: left; }
14    .test p.right { float: right; width: 14.98em; background: teal; color: aqua; text-align: center; }
15   </style>
16   <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#floats" title="9.5 Floats">
17  </head>
18  <body>
19   <p>The word "fail" should not appear below.</p>
20   <div class="test">
21    <p class="left"> TEST: </p>
22    <p class="right"> PASS </p>
23    fail fail fail fail fail fail fail fail fail fail
24    fail fail fail fail fail fail fail fail fail fail
25    fail fail fail fail fail fail fail fail fail fail
26    fail fail fail fail fail fail fail fail fail fail
27    fail fail fail fail fail fail fail fail fail fail
28   </div>
29   <!-- this test actually failed in Mozilla once -->
30  </body>
31 </html>