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

Unified Diff: third_party/WebKit/LayoutTests/fragmentation/table-overlapping-rowspan.html

Issue 2433403002: Pay attention to tall rowspanned cells in the first layout pass. (Closed)
Patch Set: rebase master Created 4 years, 2 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 side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/LayoutTests/fragmentation/table-overlapping-rowspan.html
diff --git a/third_party/WebKit/LayoutTests/fragmentation/table-overlapping-rowspan.html b/third_party/WebKit/LayoutTests/fragmentation/table-overlapping-rowspan.html
new file mode 100644
index 0000000000000000000000000000000000000000..848d9def1c8c641831c417c9f8add5eb0d10db16
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fragmentation/table-overlapping-rowspan.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<p>There should be two squares below, of different size and color.</p>
+
+<!-- This test assumes that the implementation refrains from distributing space
+ over all rows spanned by a tall rowspanned cell, when that cell crosses a
+ fragmentainer boundary, and furthermore, also makes sure that subsequent
+ rowspanned cells stay away from those rows.
+
+ This isn't specced anywhere, but it's probably the most sensible behavior,
+ given that we don't want the fragmentation machinery and the vertical
+ alignment machinery to meet. -->
+
+<div id="multicol" style="position:relative; columns:3; column-fill:auto; orphans:1; widows:1; line-height:20px; height:200px;">
+ <div style="height:170px;"></div>
+ <table cellspacing="0" cellpadding="0">
+ <tr data-expected-height="50">
+ <td rowspan="3" data-expected-height="110">
+ <div data-offset-y="170" style="position:relative; width:50px;"><br></div>
+ <div data-offset-y="0" style="position:relative; width:50px; background:blue;"><br></div>
+ <div data-offset-y="20" style="position:relative; width:50px; background:blue;"><br></div>
+ <div data-offset-y="40" style="position:relative; width:50px; background:blue;"><br></div>
+ <div data-offset-y="60" style="position:relative; width:50px; background:blue;"><br></div>
+ </td>
+ <td data-expected-height="50">
+ <br>
+ <div style="width:30px; background:blue;"><br></div>
+ </td>
+ <td data-expected-height="50"><br><br></td>
+ <td data-expected-height="50"><br><br></td>
+ <td data-expected-height="50"><br></td>
+ </tr>
+ <tr data-expected-height="20">
+ <td data-expected-height="20" style="background:blue;"><br></td>
+ <td data-expected-height="20"><br></td>
+ <td data-expected-height="20"><br></td>
+ <td data-expected-height="20"><br></td>
+ </tr>
+ <tr data-expected-height="40">
+ <td data-expected-height="40" style="background:blue;">
+ <br>
+ </td>
+ <td data-expected-height="40">
+ <div style="width:50px; height:1px;"></div>
+ </td>
+ <td data-expected-height="40" style="background:hotpink;">
+ <div style="width:50px;"><br></div>
+ </td>
+ <td data-expected-height="120" rowspan="2" style="background:hotpink;">
+ <div style="width:70px; background:hotpink;"><br></div>
+ <div style="width:70px; background:hotpink;"><br></div>
+ <div style="width:70px; background:hotpink;"><br></div>
+ <div style="width:70px; background:hotpink;"><br></div>
+ <div style="width:70px; background:hotpink;"><br></div>
+ <div style="width:70px; background:hotpink;"><br></div>
+ </td>
+ </tr>
+ <tr data-expected-height="80">
+ <td data-expected-height="80"><br></td>
+ <td data-expected-height="80"><br></td>
+ <td data-expected-height="80"><br></td>
+ <td data-expected-height="80" style="background:hotpink;"><br></td>
+ </tr>
+ </table>
+</div>
+
+<script src="../resources/check-layout.js"></script>
+<script>
+ checkLayout("#multicol");
+</script>

Powered by Google App Engine
This is Rietveld 408576698