float-replaced-height-003

Floating replaced elements with intrinsic ratios and 'height' set to 'auto'

WeasyPrint

This browser

Flags
image
Assertion
The 'height' is the used width divided by the ratio when an floated replaced element has an intrinsic ratio, 'height' is set to 'auto' and 'width' is specified.

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: Floating replaced elements with intrinsic ratios and 'height' set to 'auto'</title>
 5         <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
 6         <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#inline-replaced-height">
 7         <meta name="flags" content="image">
 8         <meta name="assert" content="The 'height' is the used width divided by the ratio when an floated replaced element has an intrinsic ratio, 'height' is set to 'auto' and 'width' is specified.">
 9         <style type="text/css">
10             div
11             {
12                 line-height: 0;
13                 position: relative;
14             }
15             div div
16             {
17                 background: orange;
18                 height: 1in;
19                 left: 1in;
20                 position: absolute;
21                 top: 0;
22             }
23             img
24             {
25                 height: auto;
26             }
27             div, img
28             {
29                 float: left;
30             }
31             div div, img
32             {
33                 width: 1in;
34             }
35         </style>
36     </head>
37     <body>
38         <p>Test passes if the blue and orange boxes below are the same height.</p>
39         <div>
40             <img alt="blue 15x15" src="support/blue15x15.png">
41             <div></div>
42         </div>
43     </body>
44 </html>