Don't resume on top of repeated header on top of monolithic overflow.

A repeated table header may have to overlap with monolithic overflow from the previous page, but actual table content should still resume *after* the repeated header. We had code that made sure that we'd resume below monolithic content, since we temporarily adjust the offset to place the repeated header. However, if the repeated header is taller than the monolithic overflow, we're already at the correct offset. Never move the offset back, because then regular table content might be placed on top of the repeated header. Bug: 1458850 Change-Id: Ia01e6ae4ac4498737c67b0ba34b5890b0fc36803 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4793950 Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org> Commit-Queue: Morten Stenshorne <mstensho@chromium.org> Cr-Commit-Position: refs/heads/main@{#1185295}
web-platform-tests · Aug 18, 2023 · 2887e32 · 2887e32
1 parent 1cc4e0c
commit 2887e32
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 0 deletions.
diff --git a/css/printing/monolithic-overflow-023-print-ref.html b/css/printing/monolithic-overflow-023-print-ref.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+  @page {
+    size: 600px;
+    margin: 0;
+  }
+  body {
+    margin: 0;
+  }
+</style>
+<div style="width:100px; height:100px; background:green;"></div>
+<div>
+  There should be two pages. A green square should be on each page. Nothing
+  should overlap with the square.
+</div>
+<div style="break-before:page; width:100px; height:100px; background:green;"></div>
+<div style="height:100px; border:solid;">
+  This text should go on the second page, right below the green square. It
+  should NOT be placed on top of the square.
+</div>
diff --git a/css/printing/monolithic-overflow-023-print.html b/css/printing/monolithic-overflow-023-print.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1458850">
+<link rel="match" href="monolithic-overflow-023-print-ref.html">
+<style>
+  @page {
+    size: 600px;
+    margin: 0;
+  }
+  body {
+    margin: 0;
+  }
+</style>
+<div style="display:table;">
+  <div style="display:table-header-group; break-inside:avoid;">
+    <div style="width:100px; height:100px; background:green;"></div>
+  </div>
+  <div style="display:table-row;">
+    <div style="height:530px; contain:size;">
+      There should be two pages. A green square should be on each page. Nothing
+      should overlap with the square.
+    </div>
+  </div>
+  <div style="display:table-row;">
+    <div style="height:100px; border:solid;">
+      This text should go on the second page, right below the green square. It
+      should NOT be placed on top of the square.
+    </div>
+  </div>
+</div>