block-replaced-height-002

Block replaced elements relying on intrinsic height dimensions

WeasyPrint

This browser

Flags
image
Assertion
The 'height' is the intrinsic height when an block replaced element with and intrinsic height has a 'height' and 'width' computed as 'auto'.

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: Block replaced elements relying on intrinsic height dimensions</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 intrinsic height when an block replaced element with and intrinsic height has a 'height' and 'width' computed as 'auto'.">
 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: 15px;
19                 left: 15px;
20                 position: absolute;
21                 top: 0;
22                 width: 15px;
23             }
24             img
25             {
26                 display: block;
27                 height: auto;
28                 width: auto;
29             }
30         </style>
31     </head>
32     <body>
33         <p>Test passes if the blue and orange boxes below are the same height.</p>
34         <div>
35             <img alt="blue 15x15" src="support/blue15x15.png">
36             <div></div>
37         </div>
38     </body>
39 </html>