block-in-inline-append-002

blocks inside inlines – append-to-nested-split-inline-1

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

This browser

Flags
dom

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html><head>
 3     <link rel="reference" href="block-in-inline-append-002-ref.xht">
 4     <link rel="reference" href="block-in-inline-append-002-nosplit-ref.xht">
 5     <title>CSS Test: blocks inside inlines – append-to-nested-split-inline-1</title>
 6     <link rel="author" title="Boris Zbarsky" href="mailto:bzbarsky@mit.edu">
 7     <link rel="author" title="Mozilla Corporation" href="http://mozilla.com/">
 8     <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#anonymous-block-level">
 9     <meta name="flags" content="dom">
10     <style type="text/css">
11       #outermost { border: 2px solid; }
12       #outer { border: 4px solid yellow; }
13       #inner { border: 6px sold green; }
14     </style>
15     <script type="text/javascript">
16       function doTest() {
17         var i = document.getElementById("inner");
18         var frag = document.createDocumentFragment();
19         var newSpan = document.createElement("span");
20         newSpan.appendChild(document.createTextNode("span"));
21         newSpan.style.display = "block";
22         frag.appendChild(newSpan);
23         frag.appendChild(document.createTextNode("after span"));
24         i.appendChild(frag);
25       }
26     </script>
27   </head>
28   <body onload="doTest()">
29     <span id="outermost">
30       <span id="outer">
31         <span id="inner">
32           <span style="display: block"></span>
33           before span
34         </span>
35       </span>
36     </span>
37   
38 
39 </body></html>