Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(484)

Side by Side Diff: LayoutTests/fast/table/table-all-rowspans-height-distribution-in-rows.html

Issue 19635004: Row spanning cell content is flowing out of the cell border if this row spanning cell comes under t… (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@RowSpan_B249600_9
Patch Set: Created 7 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>Table rowspan</title>
5 <script src="../../resources/check-layout.js"></script>
6 <style>
7 td { font: 15px/1 Ahem }
8 #div-table { display: table; border-spacing: 2px }
9 #div-row, #span-row { display: table-row }
10 #div-cell, #span-cell { display: table-cell }
11 #div-table, #div-row, #span-row, #div-cell, #span-cell{ border: 1px solid bl ack }
12 </style>
13 </head>
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>
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>
18 <table border="1">
19 <tbody>
20 <tr data-expected-height="19">
21 <td rowspan="6" style="height:400px">row0 col0 rowspan=6 height=400px</td>
22 <td>row0 col1</td>
23 </tr>
24 <tr data-expected-height="19">
25 <td>row1 col1</td>
26 </tr>
27 <tr data-expected-height="0">
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>
30 <tr data-expected-height="165">
31 <td>row3 col2</td>
32 </tr>
33 <tr data-expected-height="168">
34 <td>row4 col2</td>
35 </tr>
36 <tr data-expected-height="20">
37 <td>row5 col1</td>
38 </tr>
39 <tr data-expected-height="19">
40 <td>row6 col0</td>
41 </tr>
42 </tbody>
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>
45 <table border="1" width="607">
46 <tbody>
47 <tr data-expected-height="23">
48 <td rowspan="6" style="height:600px">row0 col0 rowspan=6 height=600px</td>
49 <td>row0 col1</td>
50 </tr>
51 <tr data-expected-height="24">
52 <td>row1 col1</td>
53 </tr>
54 <tr data-expected-height="0">
55 <td rowspan="3" style="height:400px">row2 col1 rowspan=3 height=400px</td>
56 </tr>
57 <tr data-expected-height="247">
58 <td>row3 col2</td>
59 </tr>
60 <tr data-expected-height="260">
61 <td>row4 col2</td>
62 </tr>
63 <tr data-expected-height="25">
64 <td>row5 col1</td>
65 </tr>
66 <tr data-expected-height="19">
67 <td>row6 col0</td>
68 </tr>
69 </tbody>
70 </table>
71 <h5>Test 3 - 2 same row spanning cells with diffrent heights.</h5>
72 <table border="1">
73 <tbody>
74 <tr data-expected-height="0">
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>
77 </tr>
78 <tr data-expected-height="90">
79 <td>row1 col1</td>
80 </tr>
81 <tr data-expected-height="94">
82 <td>row2 col1</td>
83 </tr>
84 <tr data-expected-height="95">
85 <td>row3 col1</td>
86 </tr>
87 <tr data-expected-height="99">
88 <td>row4 col1</td>
89 </tr>
90 <tr data-expected-height="99">
91 <td>row5 col1</td>
92 </tr>
93 <tr data-expected-height="19">
94 <td>row6 col0</td>
95 </tr>
96 </tbody>
97 </table>
98 <h5>Test 4 - some rows are common between 2 row spanning cells.</h5>
99 <table border="1">
100 <tbody>
101 <tr data-expected-height="43">
102 <td rowspan="6" style="height:400px">row0 col0 rowspan=6 height=400px</t d>
103 <td>row0 col1</td>
104 </tr>
105 <tr data-expected-height="0">
106 <td rowspan="6" style="height:800px">row1 col1 rowspan=6 height=800px</t d>
107 </tr>
108 <tr data-expected-height="168">
109 <td>row2 col2</td>
110 </tr>
111 <tr data-expected-height="177">
112 <td>row3 col2</td>
113 </tr>
114 <tr data-expected-height="176">
115 <td>row4 col2</td>
116 </tr>
117 <tr data-expected-height="189">
118 <td>row5 col2</td>
119 </tr>
120 <tr data-expected-height="42">
121 <td>row6 col2</td>
122 </tr>
123 <tr data-expected-height="19">
124 <td>row7 col0</td>
125 </tr>
126 </tbody>
127 </table>
128 <h5>Test 5 - RowSpan and ColSpan. </h5>
129 <table border="1" width="607">
130 <tbody>
131 <tr data-expected-height="34">
132 <td>row0 col0</td>
133 <td rowspan="3" colspan="2">row0 col1 - rowspan=3 colspan=2</td>
134 <td>row0 col2</td>
135 </tr>
136 <tr data-expected-height="34">
137 <td>row1 col0</td>
138 </tr>
139 <tr data-expected-height="34">
140 <td>row2 col0</td>
141 </tr>
142 <tr data-expected-height="19">
143 <td colspan="3">row3 col0 - colspan=3</td>
144 </tr>
145 <tr data-expected-height="34">
146 <td>row4 col0</td>
147 </tr>
148 </tbody>
149 </table>
150 <h5>Test 6 - Mix of baseline aligned and non-baseline aligned cells.</h5>
151 <table border="1" width="607">
152 <tbody>
153 <tr data-expected-height="104">
154 <td style="height:100px">row0 col0</td>
155 <td style="vertical-align:top">row0 col1 vertical-align=top</td>
156 <td style="vertical-align:bottom">row0 col2 vertical-align=bottom</td>
157 </tr>
158 <tr data-expected-height="19">
159 <td>row1 col0</td>
160 </tr>
161 <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>
163 <td style="vertical-align:sub">row2 col1 vertical-align=sub</td>
164 </tr>
165 <tr data-expected-height="77">
166 <td style="vertical-align:middle">row3 col1 vertical-align=middle</td>
167 </tr>
168 <tr data-expected-height="69">
169 <td style="vertical-align:super">row4 col1 vertical-align=super</td>
170 </tr>
171 <tr data-expected-height="91">
172 <td style="vertical-align:text-bottom">row5 col1 vertical-align=text-botto m</td>
173 </tr>
174 <tr data-expected-height="19">
175 <td>row6 col0</td>
176 </tr>
177 </tbody>
178 </table>
179 <h5>Test 7 - CSS Table.</h5>
180 <div id="div-table">
181 <span id="span-row">
182 <span id="span-cell">row0 col0</span>
183 <div id="div-cell">row0 col1</div>
184 <span id="span-cell">row0 col2</span>
185 </span>
186 <div id="div-row">
187 <div id="div-cell">row1 col0</div>
188 <span id="span-cell">row1 col1</span>
189 <div id="div-cell">row1 col2</div>
190 </div>
191 <div id="div-row">
192 <span id="span-cell">row2 col0</span>
193 </div>
194 <span id="span-row">
195 <div id="div-cell">row3 col0</div>
196 </span>
197 <span id="span-row">
198 <span id="span-cell">row4 col0</span>
199 <span id="span-cell">row4 col1</span>
200 <span id="span-cell">row4 col2</span>
201 </span>
202 <div id="div-row">
203 <span id="span-cell">row5 col0</span>
204 <div id="div-cell">row5 col1</div>
205 <span id="span-cell">row5 col2</span>
206 </div>
207 <span id="span-row">
208 <div id="div-cell">row6 col0</div>
209 <span id="span-cell">row6 col1</span>
210 </span>
211 <div id="div-row">
212 <div id="div-cell">row7 col0</div>
213 </div>
214 <span id="span-row">
215 <span id="span-cell">row8 col0</span>
216 </span>
217 <div id="div-row">
218 <div id="div-cell">row9 col0</div>
219 </div>
220 <div id="div-row">
221 <div id="div-cell">row10 col0</div>
222 </div>
223 </div>
224 <h5>Test 8 - Table Similar to CSS table with rowspan.</h5>
225 <table border="1px">
226 <tr data-expected-height="21">
227 <td rowspan=5 style="height:300px">row0 col0</td>
228 <td>row0 col1</td>
229 <td>row0 col2</td>
230 </tr>
231 <tr data-expected-height="87">
232 <td rowspan=3 style="height:200px">row1 col1</td>
233 <td rowspan=2 style="height:100px">row1 col2</td>
234 <td>row1 col3</td>
235 </tr>
236 <tr data-expected-height="96">
237 <td>row2 col3</td>
238 </tr>
239 <tr data-expected-height="40">
240 <td>row3 col2</td>
241 </tr>
242 <tr data-expected-height="24">
243 <td>row4 col1</td>
244 <td>row4 col2</td>
245 <td>row4 col3</td>
246 </tr>
247 <tr data-expected-height="19">
248 <td>row5 col0</td>
249 <td>row5 col1</td>
250 <td>row5 col2</td>
251 </tr>
252 <tr data-expected-height="0">
253 <td rowspan=5 style="height:200px">row6 col0</td>
254 <td rowspan=5 style="height:100px">row6 col1</td>
255 </tr>
256 <tr data-expected-height="37">
257 <td>row7 col1</td>
258 </tr>
259 <tr data-expected-height="38">
260 <td>row8 col1</td>
261 </tr>
262 <tr data-expected-height="49">
263 <td>row9 col1</td>
264 </tr>
265 <tr data-expected-height="49">
266 <td>row10 col1</td>
267 </tr>
268 </table>
269 </body>
270 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698