floats-wrap-top-below-inline-001r

Test for wrapping around floats whose top is below the top of what must wrap around them

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

Reference (bad) by WeasyPrint

Reference (bad) by this browser

This browser

Assertion
However, line boxes created next to the float are shortened to make room for the margin box of the float.

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html><head>
 3 <link rel="reference" href="floats-wrap-top-below-001r-ref.xht">
 4 <title>CSS Test: Test for wrapping around floats whose top is below the top of what must wrap around them</title>
 5 <link rel="author" title="L. David Baron" href="http://dbaron.org/">
 6 <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/">
 7 <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#floats">
 8 <meta name="assert" content="However, line boxes created next to the float are shortened to make room for the margin box of the float.">
 9 <meta name="flags" content="">
10 <style type="text/css">
11 
12 body { width: 400px; border: medium solid; text-align: right; }
13 div { float: right; clear: right; }
14 span { display: inline-block; vertical-align: top; width: 200px; height: 50px; background: aqua; }
15 
16 </style>
17 </head>
18 <body>
19 
20 <div style="width: 50px; height: 75px;"></div>
21 <div style="width: 100px; height: 75px;"></div>
22 <span></span>
23 <span></span>
24 
25 
26 
27 </body></html>