gecko-dev/testing/web-platform/tests/css/css-overflow/scroll-buttons-enabled-ref.html
Daniil Sakhapov 54835f544c Bug 1937577 [wpt PR 49707] - [carousel] Move ::scroll-button() tests to external WPT, a=testonly
Automatic update from web-platform-tests
[carousel] Move ::scroll-button() tests to external WPT

As the spec for ::scroll-button()s is mature enough and passed a few
reviews, not making them .tentative.

Spec: https://drafts.csswg.org/css-overflow-5/#scroll-buttons
Bug: 370067113
Change-Id: I6ccd167a5d2b3df35455d0f0544cb6486a1da4a3
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6098131
Commit-Queue: Daniil Sakhapov <sakhapov@chromium.org>
Reviewed-by: Rune Lillesveen <futhark@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1396776}

--

wpt-commits: 6cb6ef34e9294bb1dfc7eb07ff1123011542a687
wpt-pr: 49707
2024-12-18 13:21:05 +00:00

59 lines
1.1 KiB
HTML

<!doctype html>
<title>CSS Test Reference: ::scroll-button(inline-end) supports :enabled</title>
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<style>
* {
margin: 0;
font-family: Ahem;
}
button {
appearance: none;
}
#scroller {
width: 600px;
height: 300px;
overflow: auto;
scroll-marker-group: after;
white-space: nowrap;
}
#scroller div {
background: green;
display: inline-block;
width: 600px;
height: 270px;
}
#scroll-marker-group {
border: 3px solid black;
padding: 5px;
display: flex;
height: 20px;
width: 40px;
}
#scroll-button-inline-end {
background: gold;
display: flex;
height: 20px;
width: 20px;
}
.scroll-marker {
width: 10px;
height: 10px;
background-color: blue;
border-radius: 100%;
display: inline-block;
}
</style>
<div id="scroller">
<div></div>
<div></div>
</div>
<button id="scroll-button-inline-end">p</button>
<div id="scroll-marker-group">
<div class="scroll-marker"></div>
<div class="scroll-marker"></div>
</div>