| OLD | NEW |
|---|
| (Empty) |
| 1 <html> | |
| 2 <head> | |
| 3 <style type="text/css"> | |
| 4 /* Make sure the console and the description don't interfere wit
h the rest of the layout. */ | |
| 5 #description { | |
| 6 position: absolute; | |
| 7 top: 0px; | |
| 8 } | |
| 9 | |
| 10 #console { | |
| 11 position: absolute; | |
| 12 top: 100px; | |
| 13 } | |
| 14 | |
| 15 #divMain1 { | |
| 16 -webkit-flow-into: flow1; | |
| 17 border: 2px solid blue; | |
| 18 height: 150px; | |
| 19 margin: 10px; | |
| 20 padding: 5px; | |
| 21 } | |
| 22 | |
| 23 #divMain2 { | |
| 24 border: 2px solid blue; | |
| 25 height: 135px; | |
| 26 margin: 5px; | |
| 27 -webkit-flow-into: flow2; | |
| 28 } | |
| 29 | |
| 30 .divText { | |
| 31 border: 1px solid green; | |
| 32 color: green; | |
| 33 font-size: 14px; | |
| 34 } | |
| 35 | |
| 36 #divText1 { | |
| 37 width: 250px; | |
| 38 margin: 10px; | |
| 39 padding-left: 5px; | |
| 40 float: right; | |
| 41 } | |
| 42 | |
| 43 #divText2 { | |
| 44 width: 200px; | |
| 45 float: left; | |
| 46 margin: 10px; | |
| 47 } | |
| 48 | |
| 49 #region1 { | |
| 50 -webkit-flow-from: flow1; | |
| 51 border: 1px solid red; | |
| 52 position: relative; | |
| 53 left: 75px; | |
| 54 top: 264px; | |
| 55 width: 400px; | |
| 56 height: 180px; | |
| 57 } | |
| 58 | |
| 59 #region2 { | |
| 60 -webkit-flow-from: flow2; | |
| 61 border: 1px solid red; | |
| 62 position: relative; | |
| 63 left: 274px; | |
| 64 top: 292px; | |
| 65 width: 400px; | |
| 66 height: 150px; | |
| 67 } | |
| 68 | |
| 69 .grid { | |
| 70 position: absolute; | |
| 71 top: 750px; | |
| 72 width: 100px; | |
| 73 height: 100px; | |
| 74 border-right: 1px solid blue; | |
| 75 text-align: right; | |
| 76 font-size: 14px; | |
| 77 color: blue; | |
| 78 } | |
| 79 | |
| 80 .vgrid { | |
| 81 position: absolute; | |
| 82 left: 900px; | |
| 83 width: 100px; | |
| 84 height: 100px; | |
| 85 border-bottom: 1px solid blue; | |
| 86 text-align: bottom; | |
| 87 font-size: 14px; | |
| 88 color: blue; | |
| 89 } | |
| 90 | |
| 91 #grid1 { | |
| 92 left: 0px; | |
| 93 } | |
| 94 #grid2 { | |
| 95 left: 100px; | |
| 96 } | |
| 97 #grid3 { | |
| 98 left: 200px; | |
| 99 } | |
| 100 #grid4 { | |
| 101 left: 300px; | |
| 102 } | |
| 103 #grid5 { | |
| 104 left: 400px; | |
| 105 } | |
| 106 #grid6 { | |
| 107 left: 500px; | |
| 108 } | |
| 109 #grid7 { | |
| 110 left: 600px; | |
| 111 } | |
| 112 | |
| 113 #vgrid1 { | |
| 114 top: 0px; | |
| 115 } | |
| 116 #vgrid2 { | |
| 117 top: 100px; | |
| 118 } | |
| 119 #vgrid3 { | |
| 120 top: 200px; | |
| 121 } | |
| 122 #vgrid4 { | |
| 123 top: 300px; | |
| 124 } | |
| 125 #vgrid5 { | |
| 126 top: 400px; | |
| 127 } | |
| 128 #vgrid6 { | |
| 129 top: 500px; | |
| 130 } | |
| 131 #vgrid7 { | |
| 132 top: 600px; | |
| 133 } | |
| 134 #vgrid8 { | |
| 135 top: 700px; | |
| 136 border: none; | |
| 137 } | |
| 138 </style> | |
| 139 | |
| 140 <script src="../../../resources/js-test.js"></script> | |
| 141 | |
| 142 <script type="text/javascript"> | |
| 143 function writeOffsetInfo(selector) { | |
| 144 var divItems = document.querySelectorAll(selector); | |
| 145 | |
| 146 for (var i=0; i<divItems.length; i++) { | |
| 147 var divItem = divItems[i]; | |
| 148 var existingHTML = divItem.innerHTML; | |
| 149 var newHTML = existingHTML.replace("#offTop#", d
ivItem.offsetTop); | |
| 150 newHTML = newHTML.replace("#offLeft#", divItem.o
ffsetLeft); | |
| 151 if (divItem.offsetParent) | |
| 152 newHTML = newHTML.replace("#offParent#",
divItem.offsetParent.tagName + "(" + divItem.offsetParent.id + ")"); | |
| 153 else | |
| 154 newHTML = newHTML.replace("#offParent#",
"null"); | |
| 155 divItem.innerHTML = newHTML; | |
| 156 } | |
| 157 } | |
| 158 function myOnLoad() { | |
| 159 writeOffsetInfo(".divText"); | |
| 160 } | |
| 161 </script> | |
| 162 </head> | |
| 163 | |
| 164 <body id="body" onload = "myOnLoad();"> | |
| 165 | |
| 166 <div id="divMain1"> | |
| 167 <div class="divText" id="divText1">This is <b>divText1</b> (floa
t right):<br/>- offsetParent is <b>#offParent#</b><br/>- offsetLeft is <b>#offLe
ft#</b><br/>- offsetTop is <b>#offTop#</b></div> | |
| 168 <span class="mySpan" style="color: blue;">This text should flow
around the green div. This text should flow around the green div. This text shou
ld flow around the green div. This text should flow around the green div. This t
ext should flow around the green div.</span> | |
| 169 </div> | |
| 170 | |
| 171 <div id="divMain2"> | |
| 172 <div class="divText" id="divText2">This is <b>divText2</b> (floa
t left):<br/>- offsetParent is <b>#offParent#</b><br/>- offsetLeft is <b>#offLef
t#</b><br/>- offsetTop is <b>#offTop#</b></div> | |
| 173 <span class="mySpan" style="color: blue;">This text should flow
around the green div. This text should flow around the green div. This text shou
ld flow around the green div. This text should flow around the green div. This t
ext should flow around the green div.</span> | |
| 174 </div> | |
| 175 | |
| 176 <div class="region" id="region1"></div> | |
| 177 <div class="region" id="region2"></div> | |
| 178 | |
| 179 <div id="grid1" class="grid">100px</div> | |
| 180 <div id="grid2" class="grid">200px</div> | |
| 181 <div id="grid3" class="grid">300px</div> | |
| 182 <div id="grid4" class="grid">400px</div> | |
| 183 <div id="grid5" class="grid">500px</div> | |
| 184 <div id="grid6" class="grid">600px</div> | |
| 185 <div id="grid7" class="grid">700px</div> | |
| 186 | |
| 187 <div id="vgrid1" class="vgrid"></div> | |
| 188 <div id="vgrid2" class="vgrid">100px</div> | |
| 189 <div id="vgrid3" class="vgrid">200px</div> | |
| 190 <div id="vgrid4" class="vgrid">300px</div> | |
| 191 <div id="vgrid5" class="vgrid">400px</div> | |
| 192 <div id="vgrid6" class="vgrid">500px</div> | |
| 193 <div id="vgrid7" class="vgrid">600px</div> | |
| 194 <div id="vgrid8" class="vgrid">700px</div> | |
| 195 | |
| 196 <script> | |
| 197 description("Test offsetLeft and offsetTop in a named flow with
floats.") | |
| 198 | |
| 199 shouldBe("divText1.offsetParent", "document.body"); | |
| 200 shouldBe("divText1.offsetLeft", "200"); | |
| 201 shouldBe("divText1.offsetTop", "300"); | |
| 202 | |
| 203 shouldBe("divText2.offsetParent", "document.body"); | |
| 204 shouldBe("divText2.offsetLeft", "300"); | |
| 205 shouldBe("divText2.offsetTop", "500"); | |
| 206 | |
| 207 if (window.testRunner) { | |
| 208 var allGraphicElements = document.querySelectorAll(".reg
ion, .divText, .grid, .vgrid, .mySpan"); | |
| 209 for (var i=0; i<allGraphicElements.length; i++) | |
| 210 allGraphicElements[i].style.display = "none"; | |
| 211 } | |
| 212 | |
| 213 </script> | |
| 214 </body> | |
| 215 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 159933010:
Remove everything region-specific from LayoutTests. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master