block-non-replaced-width-006

Solving width for block-level non-replaced elements in normal flow with multiple properties with 'auto' values

WeasyPrint

This browser

Assertion
If 'width' is set to 'auto', any other 'auto' values become '0' and the 'width' is computed based on remaining space which includes any negative width.

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: Solving width for block-level non-replaced elements in normal flow with multiple properties with 'auto' values</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#blockwidth">
 7         <meta name="flags" content="">
 8         <meta name="assert" content="If 'width' is set to 'auto', any other 'auto' values become '0' and the 'width' is computed based on remaining space which includes any negative width.">
 9         <style type="text/css">
10             body
11             {
12                 margin: 0;
13             }
14             #div1
15             {
16                 background: red;
17                 width: 100%;
18             }
19             div div
20             {
21                 background-color: green;
22                 border: 10px solid green;
23                 margin: 0 auto;
24                 padding: 0;
25                 height: 20px;
26                 width: auto;
27             }
28         </style>
29     </head>
30     <body>
31         <p>Test passes if the box below spans the entire width of the page and there is no red visible on the page.</p>
32         <div id="div1">
33             <div></div>
34         </div>
35     </body>
36 </html>