display-change-001

Updating layout on display changes

WeasyPrint

This browser

Flags
ahem, dom

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: Updating layout on display changes</title>
 5     <link rel="author" title="Boris Zbarsky" href="mailto:bzbarsky@mit.edu">
 6     <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#display-prop">
 7     <meta name="flags" content="ahem dom">
 8     <meta http-equiv="Content-Script-Type" content="text/javascript">
 9     <script type="text/javascript">
10       function test() {
11         document.getElementById('float').style.display = 'none';
12       }
13     </script>
14     <style type="text/css">
15       #float { width: 100%; float:left; }
16       div { background: red; color: green; width: 1em; font-family: Ahem; line-height: 1; }
17     </style>
18   </head>
19   <body onload="test()">
20     <p>There should be no red below, only green.</p>
21     <div id="float">X</div>
22     <div>
23       X
24     </div>
25   </body>
26 </html>