| 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 } |
| 11 #div-table, #div-row, #span-row, #div-cell, #span-cell{ border: 1px solid bl
ack } | 11 #div-table, #div-row, #span-row, #div-cell, #span-cell{ border: 1px solid bl
ack } |
| 12 </style> | 12 </style> |
| 13 </head> | 13 </head> |
| 14 <body onload="checkLayout('tr')"> | 14 <body onload="checkLayout('tr')"> |
| 15 <h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issues/d
etail?id=252120">252120</a>. Content of the row spanning cell is flowing out of
the cell boundries.</h3> | 15 <h3>Test for chromium bug : <a href="https://code.google.com/p/chromium/issues/d
etail?id=252120">252120</a>. Content of the row spanning cell is flowing out of
the cell boundries.</h3> |
| 16 <h4>Row spanning cell height is not set as per its content height or given heigh
t to this cells.</h4> | 16 <h4>Row spanning cell height is not set as per its content height or given heigh
t to this cells.</h4> |
| 17 <h5>Test 1 - One row spanning cell present under the boundries of other row span
ning cell and inner row spanning cell have lots of content.</h5> | 17 <h5>Test 1 - One row spanning cell present under the boundries of other row span
ning cell and inner row spanning cell have lots of content.</h5> |
| 18 <table border="1"> | 18 <table border="1"> |
| 19 <tbody> | 19 <tbody> |
| 20 <tr data-expected-height="19"> | 20 <tr data-expected-height="19"> |
| 21 <td rowspan="6" style="height:400px">row0 col0 rowspan=6 height=400px</td> | 21 <td rowspan="6" style="height:400px">row0 col0 rowspan=6 height=400px</td> |
| 22 <td>row0 col1</td> | 22 <td>row0 col1</td> |
| 23 </tr> | 23 </tr> |
| 24 <tr data-expected-height="19"> | 24 <tr data-expected-height="19"> |
| 25 <td>row1 col1</td> | 25 <td>row1 col1</td> |
| 26 </tr> | 26 </tr> |
| 27 <tr data-expected-height="0"> | 27 <tr data-expected-height="261"> |
| 28 <td rowspan="3" style="height:200px">row2 col1 rowspan=3 height=200px<br/>
row2 col1 rowspan=3 height=200px<br/>row2 col1 rowspan=3 height=200px<br/>row2 c
ol1 rowspan=3 height=200px<br/>row2 col1 rowspan=3 height=200px<br/>row2 col1 ro
wspan=3 height=200px<br/>row2 col1 rowspan=3 height=200px<br/>row2 col1 rowspan=
3 height=200px<br/>row2 col1 rowspan=3 height=200px<br/>row2 col1 rowspan=3 heig
ht=200px<br/>row2 col1 rowspan=3 height=200px<br/></td> | 28 <td rowspan="3" style="height:200px">row2 col1 rowspan=3 height=200px<br/>
row2 col1 rowspan=3 height=200px<br/>row2 col1 rowspan=3 height=200px<br/>row2 c
ol1 rowspan=3 height=200px<br/>row2 col1 rowspan=3 height=200px<br/>row2 col1 ro
wspan=3 height=200px<br/>row2 col1 rowspan=3 height=200px<br/>row2 col1 rowspan=
3 height=200px<br/>row2 col1 rowspan=3 height=200px<br/>row2 col1 rowspan=3 heig
ht=200px<br/>row2 col1 rowspan=3 height=200px<br/></td> |
| 29 </tr> | 29 </tr> |
| 30 <tr data-expected-height="165"> | 30 <tr data-expected-height="34"> |
| 31 <td>row3 col2</td> | 31 <td>row3 col2</td> |
| 32 </tr> | 32 </tr> |
| 33 <tr data-expected-height="168"> | 33 <tr data-expected-height="34"> |
| 34 <td>row4 col2</td> | 34 <td>row4 col2</td> |
| 35 </tr> | 35 </tr> |
| 36 <tr data-expected-height="20"> | 36 <tr data-expected-height="20"> |
| 37 <td>row5 col1</td> | 37 <td>row5 col1</td> |
| 38 </tr> | 38 </tr> |
| 39 <tr data-expected-height="19"> | 39 <tr data-expected-height="19"> |
| 40 <td>row6 col0</td> | 40 <td>row6 col0</td> |
| 41 </tr> | 41 </tr> |
| 42 </tbody> | 42 </tbody> |
| 43 </table> | 43 </table> |
| 44 <h5>Test 2 - One row spanning cell present under the boundries of other row span
ning cell and inner row spanning cell have its own height.</h5> | 44 <h5>Test 2 - One row spanning cell present under the boundries of other row span
ning cell and inner row spanning cell have its own height.</h5> |
| 45 <table border="1" width="607"> | 45 <table border="1" width="607"> |
| 46 <tbody> | 46 <tbody> |
| 47 <tr data-expected-height="23"> | 47 <tr data-expected-height="19"> |
| 48 <td rowspan="6" style="height:600px">row0 col0 rowspan=6 height=600px</td> | 48 <td rowspan="6" style="height:600px">row0 col0 rowspan=6 height=600px</td> |
| 49 <td>row0 col1</td> | 49 <td>row0 col1</td> |
| 50 </tr> | 50 </tr> |
| 51 <tr data-expected-height="24"> | 51 <tr data-expected-height="19"> |
| 52 <td>row1 col1</td> | 52 <td>row1 col1</td> |
| 53 </tr> | 53 </tr> |
| 54 <tr data-expected-height="0"> | 54 <tr data-expected-height="461"> |
| 55 <td rowspan="3" style="height:400px">row2 col1 rowspan=3 height=400px</td> | 55 <td rowspan="3" style="height:400px">row2 col1 rowspan=3 height=400px</td> |
| 56 </tr> | 56 </tr> |
| 57 <tr data-expected-height="247"> | 57 <tr data-expected-height="34"> |
| 58 <td>row3 col2</td> | 58 <td>row3 col2</td> |
| 59 </tr> | 59 </tr> |
| 60 <tr data-expected-height="260"> | 60 <tr data-expected-height="34"> |
| 61 <td>row4 col2</td> | 61 <td>row4 col2</td> |
| 62 </tr> | 62 </tr> |
| 63 <tr data-expected-height="25"> | 63 <tr data-expected-height="25"> |
| 64 <td>row5 col1</td> | 64 <td>row5 col1</td> |
| 65 </tr> | 65 </tr> |
| 66 <tr data-expected-height="19"> | 66 <tr data-expected-height="19"> |
| 67 <td>row6 col0</td> | 67 <td>row6 col0</td> |
| 68 </tr> | 68 </tr> |
| 69 </tbody> | 69 </tbody> |
| 70 </table> | 70 </table> |
| 71 <h5>Test 3 - 2 same row spanning cells with different heights.</h5> | 71 <h5>Test 3 - 2 same row spanning cells with different heights.</h5> |
| 72 <table border="1"> | 72 <table border="1"> |
| 73 <tbody> | 73 <tbody> |
| 74 <tr data-expected-height="0"> | 74 <tr data-expected-height="308"> |
| 75 <td rowspan="6" style="height:300px">row0 col0 rowspan=6 height=300px</td> | 75 <td rowspan="6" style="height:300px">row0 col0 rowspan=6 height=300px</td> |
| 76 <td rowspan="6" style="height:500px">row0 col1 rowspan=6 height=500px</td> | 76 <td rowspan="6" style="height:500px">row0 col1 rowspan=6 height=500px</td> |
| 77 </tr> | 77 </tr> |
| 78 <tr data-expected-height="90"> | 78 <tr data-expected-height="34"> |
| 79 <td>row1 col1</td> | 79 <td>row1 col1</td> |
| 80 </tr> | 80 </tr> |
| 81 <tr data-expected-height="94"> | 81 <tr data-expected-height="34"> |
| 82 <td>row2 col1</td> | 82 <td>row2 col1</td> |
| 83 </tr> | 83 </tr> |
| 84 <tr data-expected-height="95"> | 84 <tr data-expected-height="34"> |
| 85 <td>row3 col1</td> | 85 <td>row3 col1</td> |
| 86 </tr> | 86 </tr> |
| 87 <tr data-expected-height="99"> | 87 <tr data-expected-height="34"> |
| 88 <td>row4 col1</td> | 88 <td>row4 col1</td> |
| 89 </tr> | 89 </tr> |
| 90 <tr data-expected-height="99"> | 90 <tr data-expected-height="99"> |
| 91 <td>row5 col1</td> | 91 <td>row5 col1</td> |
| 92 </tr> | 92 </tr> |
| 93 <tr data-expected-height="19"> | 93 <tr data-expected-height="19"> |
| 94 <td>row6 col0</td> | 94 <td>row6 col0</td> |
| 95 </tr> | 95 </tr> |
| 96 </tbody> | 96 </tbody> |
| 97 </table> | 97 </table> |
| 98 <h5>Test 4 - some rows are common between 2 row spanning cells.</h5> | 98 <h5>Test 4 - some rows are common between 2 row spanning cells.</h5> |
| 99 <table border="1"> | 99 <table border="1"> |
| 100 <tbody> | 100 <tbody> |
| 101 <tr data-expected-height="43"> | 101 <tr data-expected-height="19"> |
| 102 <td rowspan="6" style="height:400px">row0 col0 rowspan=6 height=400px</t
d> | 102 <td rowspan="6" style="height:400px">row0 col0 rowspan=6 height=400px</t
d> |
| 103 <td>row0 col1</td> | 103 <td>row0 col1</td> |
| 104 </tr> | 104 </tr> |
| 105 <tr data-expected-height="0"> | 105 <tr data-expected-height="623"> |
| 106 <td rowspan="6" style="height:800px">row1 col1 rowspan=6 height=800px</t
d> | 106 <td rowspan="6" style="height:800px">row1 col1 rowspan=6 height=800px</t
d> |
| 107 </tr> | 107 </tr> |
| 108 <tr data-expected-height="168"> | 108 <tr data-expected-height="34"> |
| 109 <td>row2 col2</td> | 109 <td>row2 col2</td> |
| 110 </tr> | 110 </tr> |
| 111 <tr data-expected-height="177"> | 111 <tr data-expected-height="34"> |
| 112 <td>row3 col2</td> | 112 <td>row3 col2</td> |
| 113 </tr> | 113 </tr> |
| 114 <tr data-expected-height="176"> | 114 <tr data-expected-height="34"> |
| 115 <td>row4 col2</td> | 115 <td>row4 col2</td> |
| 116 </tr> | 116 </tr> |
| 117 <tr data-expected-height="189"> | 117 <tr data-expected-height="34"> |
| 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 - 2 spanning cells starts at different row index but end at same row
index.</h5> | 128 <h5>Test 5 - 2 spanning cells starts at different row index but end at same row
index.</h5> |
| 129 <table border="1"> | 129 <table border="1"> |
| 130 <tbody> | 130 <tbody> |
| 131 <tr data-expected-height="35"> | 131 <tr data-expected-height="19"> |
| 132 <td rowspan="6" style="height:600px">row0 col0 rowspan=6 height=400px</t
d> | 132 <td rowspan="6" style="height:600px">row0 col0 rowspan=6 height=400px</t
d> |
| 133 <td>row0 col1</td> | 133 <td>row0 col1</td> |
| 134 </tr> | 134 </tr> |
| 135 <tr data-expected-height="0"> | 135 <tr data-expected-height="423"> |
| 136 <td rowspan="5" style="height:300px">row1 col1 rowspan=6 height=800px</t
d> | 136 <td rowspan="5" style="height:300px">row1 col1 rowspan=6 height=800px</t
d> |
| 137 </tr> | 137 </tr> |
| 138 <tr data-expected-height="130"> | 138 <tr data-expected-height="34"> |
| 139 <td>row2 col2</td> | 139 <td>row2 col2</td> |
| 140 </tr> | 140 </tr> |
| 141 <tr data-expected-height="132"> | 141 <tr data-expected-height="34"> |
| 142 <td>row3 col2</td> | 142 <td>row3 col2</td> |
| 143 </tr> | 143 </tr> |
| 144 <tr data-expected-height="140"> | 144 <tr data-expected-height="34"> |
| 145 <td>row4 col2</td> | 145 <td>row4 col2</td> |
| 146 </tr> | 146 </tr> |
| 147 <tr data-expected-height="140"> | 147 <tr data-expected-height="34"> |
| 148 <td>row5 col2</td> | 148 <td>row5 col2</td> |
| 149 </tr> | 149 </tr> |
| 150 <tr data-expected-height="19"> | 150 <tr data-expected-height="19"> |
| 151 <td>row6 col2</td> | 151 <td>row6 col2</td> |
| 152 </tr> | 152 </tr> |
| 153 <tr data-expected-height="19"> | 153 <tr data-expected-height="19"> |
| 154 <td>row7 col0</td> | 154 <td>row7 col0</td> |
| 155 </tr> | 155 </tr> |
| 156 </tbody> | 156 </tbody> |
| 157 </table> | 157 </table> |
| (...skipping 114 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 272 <tr data-expected-height="24"> | 272 <tr data-expected-height="24"> |
| 273 <td>row4 col1</td> | 273 <td>row4 col1</td> |
| 274 <td>row4 col2</td> | 274 <td>row4 col2</td> |
| 275 <td>row4 col3</td> | 275 <td>row4 col3</td> |
| 276 </tr> | 276 </tr> |
| 277 <tr data-expected-height="19"> | 277 <tr data-expected-height="19"> |
| 278 <td>row5 col0</td> | 278 <td>row5 col0</td> |
| 279 <td>row5 col1</td> | 279 <td>row5 col1</td> |
| 280 <td>row5 col2</td> | 280 <td>row5 col2</td> |
| 281 </tr> | 281 </tr> |
| 282 <tr data-expected-height="0"> | 282 <tr data-expected-height="74"> |
| 283 <td rowspan=5 style="height:200px">row6 col0</td> | 283 <td rowspan=5 style="height:200px">row6 col0</td> |
| 284 <td rowspan=5 style="height:100px">row6 col1</td> | 284 <td rowspan=5 style="height:100px">row6 col1</td> |
| 285 </tr> | 285 </tr> |
| 286 <tr data-expected-height="37"> | 286 <tr data-expected-height="19"> |
| 287 <td>row7 col1</td> | 287 <td>row7 col1</td> |
| 288 </tr> | 288 </tr> |
| 289 <tr data-expected-height="38"> | 289 <tr data-expected-height="19"> |
| 290 <td>row8 col1</td> | 290 <td>row8 col1</td> |
| 291 </tr> | 291 </tr> |
| 292 <tr data-expected-height="49"> | 292 <tr data-expected-height="19"> |
| 293 <td>row9 col1</td> | 293 <td>row9 col1</td> |
| 294 </tr> | 294 </tr> |
| 295 <tr data-expected-height="49"> | 295 <tr data-expected-height="19"> |
| 296 <td>row10 col1</td> | 296 <td>row10 col1</td> |
| 297 </tr> | 297 </tr> |
| 298 </table> | 298 </table> |
| 299 </body> | 299 </body> |
| 300 </html> | 300 </html> |
| OLD | NEW |