The Tor Browser / file comparison
comparison: layout/generic/crashtests/724978.xhtml
layout/generic/crashtests/724978.xhtml
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:d6bd2a0e0b3c |
|---|---|
| 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> | |
| 2 <html xmlns="http://www.w3.org/1999/xhtml" class="reftest-wait"> | |
| 3 <head> | |
| 4 <title>Multi-column Layout: AbsPos Pagination (Interlaced Dynamic Height)</title> | |
| 5 <link rel="author" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact"/> | |
| 6 <link rel="help" href="http://www.w3.org/TR/CSS21/visudet.html#the-height-property"/> | |
| 7 <link rel="help" href="http://www.w3.org/TR/CSS21/syndata.html#length-units"/> | |
| 8 <style type="text/css"> | |
| 9 html { | |
| 10 background: white; | |
| 11 } | |
| 12 | |
| 13 .container { | |
| 14 background: red; | |
| 15 height: 24pt; | |
| 16 position: relative; | |
| 17 -moz-column-count: 2; | |
| 18 -moz-column-gap: 0; | |
| 19 } | |
| 20 .overflow { | |
| 21 width: 10pt; | |
| 22 border-bottom: lime 8px solid; | |
| 23 top: 0; | |
| 24 } | |
| 25 .following { | |
| 26 position: relative; | |
| 27 background: white; | |
| 28 width: 100pt; | |
| 29 } | |
| 30 #colset { | |
| 31 padding-top: 1px; | |
| 32 width: 300pt; | |
| 33 height: 2in; | |
| 34 -moz-column-count: 3; | |
| 35 -moz-column-gap: 0; | |
| 36 border: silver 2pt; | |
| 37 border-style: none solid; | |
| 38 } | |
| 39 #redline { | |
| 40 width: 303pt; | |
| 41 border-top: 8px solid red; | |
| 42 margin-top: -1in; | |
| 43 position: relative; | |
| 44 z-index: -1; | |
| 45 } | |
| 46 | |
| 47 .ocontainer { | |
| 48 height: 0; | |
| 49 position: relative; | |
| 50 -moz-column-count: 2; | |
| 51 -moz-column-gap: 0; | |
| 52 } | |
| 53 .o1 { /* 3rd col */ | |
| 54 height: 10in; | |
| 55 } | |
| 56 .a1 { /* 1st col */ | |
| 57 position: absolute; | |
| 58 height: 2in; | |
| 59 width: 33pt; | |
| 60 } | |
| 61 .a2 { /* 2nd col */ | |
| 62 position: absolute; | |
| 63 height: 6in; | |
| 64 width: 25pt; | |
| 65 margin-left: 25pt; | |
| 66 } | |
| 67 .a3 { /* 3rd col */ | |
| 68 position: absolute; | |
| 69 height: 10in; | |
| 70 margin-left: 10pt; | |
| 71 } | |
| 72 .a4 { /* 2nd col */ | |
| 73 width: 25pt; | |
| 74 height: 6in; | |
| 75 } | |
| 76 | |
| 77 .b1 { /* 3rd col */ | |
| 78 position: absolute; | |
| 79 height: 672pt; | |
| 80 margin-left: 20pt; | |
| 81 } | |
| 82 .b2 { /* 2nd col */ | |
| 83 position: absolute; | |
| 84 height: 384pt; | |
| 85 width: 25pt; | |
| 86 margin-left: 50pt; | |
| 87 } | |
| 88 .b3 { /* 3rd col */ | |
| 89 position: absolute; | |
| 90 height: 672pt; | |
| 91 margin-left: 30pt; | |
| 92 } | |
| 93 .b4 { /* 1st col, but no border */ | |
| 94 position: absolute; | |
| 95 height: 96pt; | |
| 96 border-bottom: none; | |
| 97 } | |
| 98 .b4 .child1 { /* 1st col */ | |
| 99 position: absolute; | |
| 100 height: 200%; | |
| 101 width: 33pt; | |
| 102 margin-left: 33pt; | |
| 103 } | |
| 104 .b4 .child2 { /* 3rd col */ | |
| 105 height: 672pt; | |
| 106 margin-left: 40pt; | |
| 107 | |
| 108 } | |
| 109 .b5 { /* 1st col */ | |
| 110 position: absolute; | |
| 111 height: 96pt; | |
| 112 width: 34pt; | |
| 113 margin-left: 66pt; | |
| 114 } | |
| 115 .b6 { /* 3rd col */ | |
| 116 height: 672pt; | |
| 117 margin-left: 50pt; | |
| 118 } | |
| 119 | |
| 120 .c1 { /* 3rd col */ | |
| 121 position: absolute; | |
| 122 height: 6in; | |
| 123 margin-left: 60pt; | |
| 124 } | |
| 125 .c2 { /* 2nd col */ | |
| 126 position: absolute; | |
| 127 height: 2in; | |
| 128 width: 25pt; | |
| 129 margin-left: 75pt; | |
| 130 } | |
| 131 .c3 { /* 3rd col */ | |
| 132 position: absolute; | |
| 133 height: 6in; | |
| 134 margin-left: 70pt; | |
| 135 } | |
| 136 .c4 { /* 3rd col */ | |
| 137 height: 6in; | |
| 138 width: 20pt; | |
| 139 margin-left: 80pt; | |
| 140 } | |
| 141 | |
| 142 .f1 { | |
| 143 margin-top: -48pt; | |
| 144 height: 96pt; | |
| 145 margin-bottom: 96pt; | |
| 146 } | |
| 147 .f2 { | |
| 148 margin-top: -24pt; | |
| 149 height: 48pt; | |
| 150 } | |
| 151 | |
| 152 .centerline { | |
| 153 margin: 0 auto; | |
| 154 top: 0; | |
| 155 left: 0; | |
| 156 right: 0; | |
| 157 position: absolute; | |
| 158 width: 8px; | |
| 159 height: 6in; | |
| 160 background: aqua; | |
| 161 } | |
| 162 | |
| 163 #dynamo { | |
| 164 background: transparent; | |
| 165 border-bottom: 8px solid orange; | |
| 166 z-index: 10; | |
| 167 height: 384pt; | |
| 168 } | |
| 169 | |
| 170 </style> | |
| 171 </head> | |
| 172 <body onload="document.getElementById('dynamo').style.height = '96pt'; | |
| 173 document.getElementById('dynamo').offsetHeight; | |
| 174 document.getElementById('dynamo').style.height = '672pt'; | |
| 175 document.getElementById('dynamo').offsetHeight; | |
| 176 document.getElementById('dynamo').style.height = '96pt'; | |
| 177 document.getElementById('dynamo').offsetHeight; | |
| 178 document.getElementById('dynamo').style.height = '384pt'; | |
| 179 document.getElementById('dynamo').offsetHeight; | |
| 180 document.getElementById('dynamo').style.height = '3000pt'; | |
| 181 document.getElementById('dynamo').offsetHeight; | |
| 182 document.getElementById('dynamo').style.height = '96pt'; | |
| 183 document.getElementById('dynamo').offsetHeight; | |
| 184 document.getElementById('dynamo').style.height = '384pt'; | |
| 185 document.getElementById('dynamo').offsetHeight; | |
| 186 document.getElementById('dynamo').style.height = '672pt'; | |
| 187 document.getElementById('dynamo').offsetHeight; | |
| 188 document.getElementById('dynamo').style.height = '384pt'; | |
| 189 document.getElementById('dynamo').offsetHeight; | |
| 190 document.getElementById('dynamo').style.height = '96pt'; | |
| 191 document.getElementById('dynamo').offsetHeight; | |
| 192 document.getElementById('dynamo').style.height = '384pt'; | |
| 193 document.documentElement.className = '' | |
| 194 "> | |
| 195 <div id="colset"> | |
| 196 <div> | |
| 197 <div class="ocontainer"> | |
| 198 <div class="centerline"></div> | |
| 199 <div class="overflow o1"></div> | |
| 200 </div> | |
| 201 <div class="container"> | |
| 202 <div class="overflow a1"></div> | |
| 203 <div class="overflow a2"></div> | |
| 204 <div class="overflow a3"></div> | |
| 205 <div class="overflow a4"></div> | |
| 206 </div> | |
| 207 <div class="ocontainer"> | |
| 208 <div id="dynamo" class="centerline"></div> | |
| 209 </div> | |
| 210 <div class="container"> | |
| 211 <div class="overflow b1"></div> | |
| 212 <div class="overflow b2"></div> | |
| 213 <div class="overflow b3"></div> | |
| 214 <div class="overflow b4"> | |
| 215 <div class="overflow child1"></div> | |
| 216 <div class="overflow child2"></div> | |
| 217 </div> | |
| 218 <div class="overflow b5"></div> | |
| 219 <div class="overflow b6"></div> | |
| 220 </div> | |
| 221 </div> | |
| 222 <p class="following f1"> | |
| 223 </p> | |
| 224 <div class="container"> | |
| 225 <div class="overflow c1"></div> | |
| 226 <div class="overflow c2"></div> | |
| 227 <div class="overflow c3"></div> | |
| 228 <div class="overflow c4"></div> | |
| 229 </div> | |
| 230 <div class="following f2"></div> | |
| 231 </div> | |
| 232 <div id="redline"></div> | |
| 233 </body> | |
| 234 </html> |
