max-width-109

Max-width - replaced elements

WeasyPrint

This browser

Flags
image
Assertion
For UAs who choose to scale replaced elements, the height of that element (based on it's intrinsic ratio) should be re-calculated based on it's constraining 'max-width' value

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html>
 3  <head>
 4   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 5   <title>CSS Test: Max-width - replaced elements</title>
 6   <link rel="author" title="James Hopkins" href="http://idreamincode.co.uk/css21testsuite">
 7   <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#min-max-widths">
 8   <meta name="flags" content="image">
 9   <meta name="assert" content="For UAs who choose to scale replaced elements, the height of that element (based on it's intrinsic ratio) should be re-calculated based on it's constraining 'max-width' value">
10   <style type="text/css">
11   #test{
12 	width:200px;
13   }
14   #test img{
15   	max-width:100px;
16 	width:200%;
17   }
18   </style>
19  </head>
20 
21  <body>
22   <p>Test is passed if there is a blue square (four equal sides) below.</p>
23   <div id="test">
24    <img src="support/swatch-blue.png" alt="Test image">
25   </div> 
26  </body>
27 </html>