| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 | |
| 3 <style> | |
| 4 #content { -webkit-flow-into: flow; } | |
| 5 .region { -webkit-flow-from: flow; } | |
| 6 .finished #content, .finished .region { display: none; } | |
| 7 | |
| 8 #region1 { width: 70px; height: 60px; } | |
| 9 #region2 { width: 200px; height: 100px; } | |
| 10 #region3 { width: 110px; height: 120px; } | |
| 11 #region4 { width: 220px; height: 100px; } | |
| 12 #region5 { width: 200px; height: 140px; } | |
| 13 </style> | |
| 14 | |
| 15 <div id="content"> | |
| 16 <div style="-webkit-region-break-after: always"><b class="check region1">Reg
ion 1</b></div> | |
| 17 | |
| 18 <div> | |
| 19 <div> | |
| 20 <div style="-webkit-region-break-after: always"> | |
| 21 <div> | |
| 22 <b class="check region2">Region 2</b> | |
| 23 <div style="-webkit-region-break-before: always; margin-top:
35px;"><b class="check region3">Region 3</b></div> | |
| 24 </div> | |
| 25 </div> | |
| 26 </div> | |
| 27 </div> | |
| 28 | |
| 29 <div><b class="check region4">Region 4</b></div> | |
| 30 | |
| 31 | |
| 32 <div style="-webkit-region-break-inside: avoid;"> | |
| 33 <b class="check region5 start">Start of region 5.</b> Do not split these
lines. Do not split these lines. Do not split these lines. Do not split these l
ines. Do not split these lines. Do not split these lines. Do not split these lin
es. <b class="check region5 end">End of region 5.</b> | |
| 34 </div> | |
| 35 | |
| 36 </div> | |
| 37 | |
| 38 <div id="region1" class="region"></div> | |
| 39 <div id="region2" class="region"></div> | |
| 40 <div id="region3" class="region"></div> | |
| 41 <div id="region4" class="region"></div> | |
| 42 <div id="region5" class="region"></div> | |
| 43 | |
| 44 <script src="resources/helper.js"></script> | |
| 45 <script> | |
| 46 if (window.testRunner) | |
| 47 testRunner.dumpAsText(); | |
| 48 if (testContentToRegionsMapping()) | |
| 49 document.body.className = "finished"; | |
| 50 </script> | |
| OLD | NEW |