Automatic update from web-platform-tests [gap-decorations] Allow gap decorations to apply to -webkit-box There should be minimal differences between display:flex and display:-webkit-box. Both display types respect the "gap" property. This patch makes it such that -webkit-box also respects the "rule" properties. Change-Id: I70e74a4a2011d22e6a709da2df29ecea1cb54383 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7836744 Commit-Queue: Ian Kilpatrick <ikilpatrick@chromium.org> Reviewed-by: Kevin Babbitt <kbabbitt@microsoft.com> Reviewed-by: Sam Davis Omekara <samomekarajr@microsoft.com> Cr-Commit-Position: refs/heads/main@{#1629668} -- wpt-commits: c87e90521e0ae5046ae873f91f3d9b8d66b959e7 wpt-pr: 59837
29 lines
816 B
HTML
29 lines
816 B
HTML
<!DOCTYPE html>
|
|
<title>
|
|
CSS Gap Decorations: Applies to a -webkit-box container.
|
|
</title>
|
|
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
|
|
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
|
|
<style>
|
|
.webkit-box-container {
|
|
display: -webkit-box;
|
|
width: 100px;
|
|
height: 50px;
|
|
background: red;
|
|
gap: 10px;
|
|
rule: solid green 10px;
|
|
}
|
|
.webkit-box-container > div {
|
|
background: green;
|
|
}
|
|
</style>
|
|
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
|
<div class="webkit-box-container">
|
|
<div style="width: 45px;"></div>
|
|
<div style="width: 45px;"></div>
|
|
</div>
|
|
<div class="webkit-box-container" style="-webkit-box-orient: vertical;">
|
|
<div style="height: 20px;"></div>
|
|
<div style="height: 20px;"></div>
|
|
</div>
|