commit 1cdd9f1900269ab544e967dc8168b761951dea4e
parent 8c6012c5b73929a510f1d66c16e070bf64b681a7
Author: Javier Contreras Tenorio <javiercon@microsoft.com>
Date: Mon, 8 Dec 2025 12:24:56 +0000
Bug 2004086 [wpt PR 56490] - [gap-decorations] Disallow painting decorations behind spanners (multicol), a=testonly
Automatic update from web-platform-tests
[gap-decorations] Disallow painting decorations behind spanners (multicol)
This CL disallows painting gap decorations behind spanners in multicol
under any circumstance. Currently, column rules don't allow this
behavior so for now we will not allow it either, although this might
change in the future. Before this CL we would allow it with `rule-break:
none` but after some discussion we decided it would be better to perhaps
not allow it then.
Bug: 357648037
Change-Id: I89d7bdd459e02a68d3a5ee2bcd3286f1ec45356c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7219490
Commit-Queue: Javier Contreras <javiercon@microsoft.com>
Reviewed-by: Alison Maher <almaher@microsoft.com>
Cr-Commit-Position: refs/heads/main@{#1554061}
--
wpt-commits: d50d6f832a9e35fb4221f04305ba8bb4e2d67aa3
wpt-pr: 56490
Diffstat:
3 files changed, 36 insertions(+), 27 deletions(-)
diff --git a/testing/web-platform/tests/css/css-gaps/multicol/multicol-gap-decorations-012-ref.html b/testing/web-platform/tests/css/css-gaps/multicol/multicol-gap-decorations-012-ref.html
@@ -75,8 +75,10 @@
<!-- Remove the 6px consumed after the spanner in the first row: -->
<div class="item" style="height:54px;"></div>
</div>
- <div class="column-gap" style="top:0; left:60px; height:60px;"></div>
- <div class="column-gap" style="top:0; left:130px; height:60px;"></div>
+ <div class="column-gap" style="top:0; left:60px; height:40px;"></div>
+ <div class="column-gap" style="top:0; left:130px; height:40px;"></div>
+ <div class="column-gap" style="top: 58px; left:60px; height:2px;"></div>
+ <div class="column-gap" style="top:58px; left:130px; height:2px;"></div>
<div class="column-gap" style="top:70px; left:60px; height:60px;"></div>
<div class="column-gap" style="top:70px; left:130px; height:60px;"></div>
<div class="column-gap" style="top:140px; left:60px; height:60px;"></div>
diff --git a/testing/web-platform/tests/css/css-gaps/multicol/multicol-gap-decorations-020-ref.html b/testing/web-platform/tests/css/css-gaps/multicol/multicol-gap-decorations-020-ref.html
@@ -29,22 +29,20 @@
color: #fff;
margin: 0px;
opacity: 0.5;
+ height: 28px;
}
.column-decor-container {
position: absolute;
- display: flex;
- flex-direction: column;
top: 2px;
left: 62px;
- row-gap: 18px;
- height: 200px;
}
.column-decor {
width: 10px;
- height: 200px;
+ height: 33px;
background: blue;
+ position: relative;
}
</style>
@@ -53,22 +51,30 @@
<div class="column-decor-container">
<div class="column-decor">
</div>
+ <div class="column-decor" style="top: 28px; height: 50px;">
+ </div>
+ <div class="column-decor" style="top: 56px; height: 61px;">
+ </div>
</div>
<div class="column-decor-container" style="left: 132px">
<div class="column-decor">
</div>
+ <div class="column-decor" style="top: 28px; height: 50px;">
+ </div>
+ <div class="column-decor" style="top: 56px; height: 61px;">
+ </div>
</div>
<div id="container">
- <p>One</p>
- <p>Two</p>
- <h2>Spanner</h2>
+ <p></p>
+ <p></p>
+ <h2></h2>
- <p>Three</p>
- <p>Four</p>
- <p>Five</p>
- <h2>Spanner</h2>
- <p>Six</p>
- <p>Seven</p>
- <p>Eight</p>
+ <p></p>
+ <p></p>
+ <p></p>
+ <h2></h2>
+ <p></p>
+ <p></p>
+ <p></p>
</div>
</body>
diff --git a/testing/web-platform/tests/css/css-gaps/multicol/multicol-gap-decorations-020.html b/testing/web-platform/tests/css/css-gaps/multicol/multicol-gap-decorations-020.html
@@ -41,22 +41,23 @@
color: #fff;
margin: 0px;
opacity: 0.5;
+ height: 28px;
}
</style>
<body>
<div id="container">
- <p>One</p>
- <p>Two</p>
- <h2>Spanner</h2>
+ <p></p>
+ <p></p>
+ <h2></h2>
- <p>Three</p>
- <p>Four</p>
- <p>Five</p>
- <h2>Spanner</h2>
- <p>Six</p>
- <p>Seven</p>
- <p>Eight</p>
+ <p></p>
+ <p></p>
+ <p></p>
+ <h2></h2>
+ <p></p>
+ <p></p>
+ <p></p>
</div>
</body>