third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-margins-expected.html - Issue 2417853002: [css-grid] Implementing the grid's first line baseline.

Unified Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-margins-expected.html

Issue 2417853002: [css-grid] Implementing the grid's first line baseline. (Closed)

Patch Set: Patch rebased. Created 4 years, 1 month ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

« no previous file with comments | « third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-margins.html ('k') | third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-must-respect-grid-order.html » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-margins-expected.html

diff --git a/third_party/WebKit/LayoutTests/css3/flexbox/flexbox-baseline-margins.html b/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-margins-expected.html

similarity index 67%

copy from third_party/WebKit/LayoutTests/css3/flexbox/flexbox-baseline-margins.html

copy to third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-margins-expected.html

index ffbd357284abf9d4b19b206f2fa067db818d2e20..ed801bdb97307e24514d37fc0ee0109152dda591 100644

--- a/third_party/WebKit/LayoutTests/css3/flexbox/flexbox-baseline-margins.html

+++ b/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-margins-expected.html

@@ -1,36 +1,28 @@

<!DOCTYPE html>

-<html>

-<head>

-<link href="resources/flexbox.css" rel="stylesheet">

<style>

-.flexbox, .inline-flexbox {

- background-color: lightgrey;

+.flexbox {

+ display: -webkit-flex;

+ display: flex;

}

-.inline-block {

- display: inline-block;

+.inline-flexbox {

+ display: -webkit-inline-flex;

+ display: inline-flex;

}

-.border {

- border: 11px solid pink;

+.flex-one {

+ -webkit-flex: 1;

+ flex: 1;

}

-.padding {

- padding: 13px;

-.margin {

- margin: 8px 0;

+.inline-block { display: inline-block; }

+.flexbox, .inline-flexbox { background-color: lightgrey; }

+.border { border: 11px solid pink; }

+.padding { padding: 13px; }

+.margin { margin: 8px 0; }

.flexbox > div {

min-width: 0;

min-height: 0;

}

</style>

-</head>

-<body>

+<p>This test ensures that Baseline Alignment works for 1-dimensional Grid like in Flexible Box, even using margins, paddings and borders.</p>

<div>

before text

@@ -81,8 +73,8 @@ the grey box.

<div>

Should align with the top

- <div class="flexbox border margin padding" style="width: 50px; height: 50px; background-color: pink">

- <div style="width: 200px; overflow: scroll; background-color: lightgrey; margin-top: 4px; border-top: 9px solid pink;"></div>

+ <div class="flexbox border margin padding" style="width: 100px; height: 100px; background-color: pink">

+ <div style="width: 200px; overflow: scroll; background-color: lightgrey; margin: 10px 0px; border-top: 10px solid pink; border-bottom: 10px solid pink;"></div>

</div>

of the horizontal scrollbar.

@@ -91,12 +83,9 @@ of the horizontal scrollbar.

<div>

Should align 10px above the

- <div class="flexbox" style="width: 50px; height: 50px; background-color: pink">

- <div style="width: 200px; overflow: scroll; background-color: lightgrey; padding-bottom: 10px"></div>

+ <div class="flexbox" style="width: 100px; height: 100px; background-color: pink">

+ <div style="width: 200px; overflow: scroll; background-color: lightgrey; padding-bottom: 10px; margin: 10px 0px; border-top: 10px solid pink; border-bottom: 10px solid pink;"></div>

</div>

horizontal scrollbar, if one is visible.

</div>

-</body>

-</html>