OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <title>Table rowspan</title> | 4 <title>Table rowspan</title> |
5 <script src="../../resources/check-layout.js"></script> | 5 <script src="../../resources/check-layout.js"></script> |
6 <style> | 6 <style> |
7 td { font: 15px/1 Ahem } | 7 td { font: 15px/1 Ahem } |
8 #div-table { display: table; border-spacing: 2px } | 8 #div-table { display: table; border-spacing: 2px } |
9 #div-row, #span-row { display: table-row } | 9 #div-row, #span-row { display: table-row } |
10 #div-cell, #span-cell { display: table-cell } | 10 #div-cell, #span-cell { display: table-cell } |
(...skipping 107 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
118 <td>row5 col2</td> | 118 <td>row5 col2</td> |
119 </tr> | 119 </tr> |
120 <tr data-expected-height="42"> | 120 <tr data-expected-height="42"> |
121 <td>row6 col2</td> | 121 <td>row6 col2</td> |
122 </tr> | 122 </tr> |
123 <tr data-expected-height="19"> | 123 <tr data-expected-height="19"> |
124 <td>row7 col0</td> | 124 <td>row7 col0</td> |
125 </tr> | 125 </tr> |
126 </tbody> | 126 </tbody> |
127 </table> | 127 </table> |
128 <h5>Test 5 - RowSpan and ColSpan. </h5> | 128 <h5>Test 5 - 2 spanning cells starts at diffrent row index but end at same row i
ndex.</h5> |
| 129 <table border="1"> |
| 130 <tbody> |
| 131 <tr data-expected-height="35"> |
| 132 <td rowspan="6" style="height:600px">row0 col0 rowspan=6 height=400px</t
d> |
| 133 <td>row0 col1</td> |
| 134 </tr> |
| 135 <tr data-expected-height="0"> |
| 136 <td rowspan="5" style="height:300px">row1 col1 rowspan=6 height=800px</t
d> |
| 137 </tr> |
| 138 <tr data-expected-height="130"> |
| 139 <td>row2 col2</td> |
| 140 </tr> |
| 141 <tr data-expected-height="132"> |
| 142 <td>row3 col2</td> |
| 143 </tr> |
| 144 <tr data-expected-height="140"> |
| 145 <td>row4 col2</td> |
| 146 </tr> |
| 147 <tr data-expected-height="140"> |
| 148 <td>row5 col2</td> |
| 149 </tr> |
| 150 <tr data-expected-height="19"> |
| 151 <td>row6 col2</td> |
| 152 </tr> |
| 153 <tr data-expected-height="19"> |
| 154 <td>row7 col0</td> |
| 155 </tr> |
| 156 </tbody> |
| 157 </table> |
| 158 <h5>Test 6 - RowSpan and ColSpan. </h5> |
129 <table border="1" width="607"> | 159 <table border="1" width="607"> |
130 <tbody> | 160 <tbody> |
131 <tr data-expected-height="34"> | 161 <tr data-expected-height="34"> |
132 <td>row0 col0</td> | 162 <td>row0 col0</td> |
133 <td rowspan="3" colspan="2">row0 col1 - rowspan=3 colspan=2</td> | 163 <td rowspan="3" colspan="2">row0 col1 - rowspan=3 colspan=2</td> |
134 <td>row0 col2</td> | 164 <td>row0 col2</td> |
135 </tr> | 165 </tr> |
136 <tr data-expected-height="34"> | 166 <tr data-expected-height="34"> |
137 <td>row1 col0</td> | 167 <td>row1 col0</td> |
138 </tr> | 168 </tr> |
139 <tr data-expected-height="34"> | 169 <tr data-expected-height="34"> |
140 <td>row2 col0</td> | 170 <td>row2 col0</td> |
141 </tr> | 171 </tr> |
142 <tr data-expected-height="19"> | 172 <tr data-expected-height="19"> |
143 <td colspan="3">row3 col0 - colspan=3</td> | 173 <td colspan="3">row3 col0 - colspan=3</td> |
144 </tr> | 174 </tr> |
145 <tr data-expected-height="34"> | 175 <tr data-expected-height="34"> |
146 <td>row4 col0</td> | 176 <td>row4 col0</td> |
147 </tr> | 177 </tr> |
148 </tbody> | 178 </tbody> |
149 </table> | 179 </table> |
150 <h5>Test 6 - Mix of baseline aligned and non-baseline aligned cells.</h5> | 180 <h5>Test 7 - Mix of baseline aligned and non-baseline aligned cells.</h5> |
151 <table border="1" width="607"> | 181 <table border="1" width="607"> |
152 <tbody> | 182 <tbody> |
153 <tr data-expected-height="104"> | 183 <tr data-expected-height="104"> |
154 <td style="height:100px">row0 col0</td> | 184 <td style="height:100px">row0 col0</td> |
155 <td style="vertical-align:top">row0 col1 vertical-align=top</td> | 185 <td style="vertical-align:top">row0 col1 vertical-align=top</td> |
156 <td style="vertical-align:bottom">row0 col2 vertical-align=bottom</td> | 186 <td style="vertical-align:bottom">row0 col2 vertical-align=bottom</td> |
157 </tr> | 187 </tr> |
158 <tr data-expected-height="19"> | 188 <tr data-expected-height="19"> |
159 <td>row1 col0</td> | 189 <td>row1 col0</td> |
160 </tr> | 190 </tr> |
161 <tr data-expected-height="77"> | 191 <tr data-expected-height="77"> |
162 <td rowspan="4" style="vertical-align:text-top; height:300px">row2 col0 -
rowspan=4 vertical-align=text-top</td> | 192 <td rowspan="4" style="vertical-align:text-top; height:300px">row2 col0 -
rowspan=4 vertical-align=text-top</td> |
163 <td style="vertical-align:sub">row2 col1 vertical-align=sub</td> | 193 <td style="vertical-align:sub">row2 col1 vertical-align=sub</td> |
164 </tr> | 194 </tr> |
165 <tr data-expected-height="77"> | 195 <tr data-expected-height="77"> |
166 <td style="vertical-align:middle">row3 col1 vertical-align=middle</td> | 196 <td style="vertical-align:middle">row3 col1 vertical-align=middle</td> |
167 </tr> | 197 </tr> |
168 <tr data-expected-height="69"> | 198 <tr data-expected-height="69"> |
169 <td style="vertical-align:super">row4 col1 vertical-align=super</td> | 199 <td style="vertical-align:super">row4 col1 vertical-align=super</td> |
170 </tr> | 200 </tr> |
171 <tr data-expected-height="91"> | 201 <tr data-expected-height="91"> |
172 <td style="vertical-align:text-bottom">row5 col1 vertical-align=text-botto
m</td> | 202 <td style="vertical-align:text-bottom">row5 col1 vertical-align=text-botto
m</td> |
173 </tr> | 203 </tr> |
174 <tr data-expected-height="19"> | 204 <tr data-expected-height="19"> |
175 <td>row6 col0</td> | 205 <td>row6 col0</td> |
176 </tr> | 206 </tr> |
177 </tbody> | 207 </tbody> |
178 </table> | 208 </table> |
179 <h5>Test 7 - CSS Table.</h5> | 209 <h5>Test 8 - CSS Table.</h5> |
180 <div id="div-table"> | 210 <div id="div-table"> |
181 <span id="span-row"> | 211 <span id="span-row"> |
182 <span id="span-cell">row0 col0</span> | 212 <span id="span-cell">row0 col0</span> |
183 <div id="div-cell">row0 col1</div> | 213 <div id="div-cell">row0 col1</div> |
184 <span id="span-cell">row0 col2</span> | 214 <span id="span-cell">row0 col2</span> |
185 </span> | 215 </span> |
186 <div id="div-row"> | 216 <div id="div-row"> |
187 <div id="div-cell">row1 col0</div> | 217 <div id="div-cell">row1 col0</div> |
188 <span id="span-cell">row1 col1</span> | 218 <span id="span-cell">row1 col1</span> |
189 <div id="div-cell">row1 col2</div> | 219 <div id="div-cell">row1 col2</div> |
(...skipping 24 matching lines...) Expand all Loading... |
214 <span id="span-row"> | 244 <span id="span-row"> |
215 <span id="span-cell">row8 col0</span> | 245 <span id="span-cell">row8 col0</span> |
216 </span> | 246 </span> |
217 <div id="div-row"> | 247 <div id="div-row"> |
218 <div id="div-cell">row9 col0</div> | 248 <div id="div-cell">row9 col0</div> |
219 </div> | 249 </div> |
220 <div id="div-row"> | 250 <div id="div-row"> |
221 <div id="div-cell">row10 col0</div> | 251 <div id="div-cell">row10 col0</div> |
222 </div> | 252 </div> |
223 </div> | 253 </div> |
224 <h5>Test 8 - Table Similar to CSS table with rowspan.</h5> | 254 <h5>Test 9 - Table Similar to CSS table with rowspan.</h5> |
225 <table border="1px"> | 255 <table border="1px"> |
226 <tr data-expected-height="21"> | 256 <tr data-expected-height="21"> |
227 <td rowspan=5 style="height:300px">row0 col0</td> | 257 <td rowspan=5 style="height:300px">row0 col0</td> |
228 <td>row0 col1</td> | 258 <td>row0 col1</td> |
229 <td>row0 col2</td> | 259 <td>row0 col2</td> |
230 </tr> | 260 </tr> |
231 <tr data-expected-height="87"> | 261 <tr data-expected-height="87"> |
232 <td rowspan=3 style="height:200px">row1 col1</td> | 262 <td rowspan=3 style="height:200px">row1 col1</td> |
233 <td rowspan=2 style="height:100px">row1 col2</td> | 263 <td rowspan=2 style="height:100px">row1 col2</td> |
234 <td>row1 col3</td> | 264 <td>row1 col3</td> |
(...skipping 26 matching lines...) Expand all Loading... |
261 </tr> | 291 </tr> |
262 <tr data-expected-height="49"> | 292 <tr data-expected-height="49"> |
263 <td>row9 col1</td> | 293 <td>row9 col1</td> |
264 </tr> | 294 </tr> |
265 <tr data-expected-height="49"> | 295 <tr data-expected-height="49"> |
266 <td>row10 col1</td> | 296 <td>row10 col1</td> |
267 </tr> | 297 </tr> |
268 </table> | 298 </table> |
269 </body> | 299 </body> |
270 </html> | 300 </html> |
OLD | NEW |