| Index: third_party/WebKit/LayoutTests/css3/flexbox/scrollbars.html
|
| diff --git a/third_party/WebKit/LayoutTests/css3/flexbox/scrollbars.html b/third_party/WebKit/LayoutTests/css3/flexbox/scrollbars.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..5e52bf8599953b803ddd0526188f2672dd3ef167
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/css3/flexbox/scrollbars.html
|
| @@ -0,0 +1,86 @@
|
| +<!DOCTYPE html>
|
| +<script src="resources/scrollbars.js"></script>
|
| +<style>
|
| +.horizontal-header {
|
| + width: 120px;
|
| +}
|
| +.vertical-header {
|
| + width: 60px;
|
| +}
|
| +.container-row {
|
| + display: flex;
|
| + flex-direction: row;
|
| + align-items: flex-start;
|
| + justify-content: flex-start;
|
| +}
|
| +.container {
|
| + flex: none;
|
| + margin: 5px;
|
| +}
|
| +.ltr {
|
| + direction: ltr;
|
| +}
|
| +.rtl {
|
| + direction: rtl;
|
| +}
|
| +.horizontal {
|
| + writing-mode: horizontal-tb;
|
| +}
|
| +.flipped-blocks {
|
| + writing-mode: vertical-rl;
|
| +}
|
| +.flipped-lines {
|
| + writing-mode: vertical-lr;
|
| +}
|
| +.flex {
|
| + border: 2px solid red;
|
| + display: flex;
|
| + overflow: scroll;
|
| + max-width: 100px;
|
| + max-height: 100px;
|
| +}
|
| +.column {
|
| + flex-direction: column;
|
| +}
|
| +.column-reverse {
|
| + flex-direction: column-reverse;
|
| +}
|
| +.row {
|
| + flex-direction: row;
|
| +}
|
| +.row-reverse {
|
| + flex-direction: row-reverse;
|
| +}
|
| +.flex > .leaf1, .flex > .leaf2, .flex > .leaf3 {
|
| + flex: none;
|
| + width: 30px;
|
| + height: 30px;
|
| + border: 2px solid blue;
|
| + margin: 3px;
|
| + display: flex;
|
| + flex-direction: column;
|
| + justify-content: center;
|
| +}
|
| +.flex > div > div {
|
| + font-size: 20px;
|
| + text-align: center;
|
| + flex: none;
|
| +}
|
| +</style>
|
| +
|
| +<div class="container-row">
|
| + <div class="vertical-header ltr horizontal"></div>
|
| + <div class="horizontal-header ltr horizontal">ltr<br>horizontal-tb</div>
|
| + <div class="vertical-header ltr flipped-blocks">ltr<br>vertical-rl</div>
|
| + <div class="vertical-header ltr flipped-blocks">ltr<br>vertical-lr</div>
|
| + <div class="horizontal-header rtl horizontal">rtl<br>horizontal-tb</div>
|
| + <div class="vertical-header rtl flipped-blocks">rtl<br>vertical-rl</div>
|
| + <div class="vertical-header rtl flipped-blocks">rtl<br>vertical-lr</div>
|
| +</div>
|
| +
|
| +<script>
|
| +flexDirections.forEach((flexDirection) => {
|
| + var containerRow = createContainerRow(flexDirection);
|
| + document.body.appendChild(containerRow);
|
| +});
|
| +</script>
|
|
|
Chromium Code Reviews
Issue 1921553008:
Fix scroll origin, overflow rects, and coordinate flipping for flexbox. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src@master