Skip to content

GitLab

T
tangled
Commit 262c6b42 authored by Stephen McGruer's avatar Stephen McGruer Committed by Commit Bot
Browse files
Options

Upstream sticky-stacking-context.html to WPT 

Bug: 699244
Change-Id: Iab42a2b1363fd3a55ae3bb77e0452157dc66ef89
Reviewed-on: https://chromium-review.googlesource.com/598708Reviewed-by: default avatarRobert Flack <flackr@chromium.org>
Commit-Queue: Stephen McGruer <smcgruer@chromium.org>
Cr-Commit-Position: refs/heads/master@{#491743}
parent 29b8809e
Hide whitespace changes
Inline Side-by-side
Showing with 55 additions and 106 deletions
third_party/WebKit/LayoutTests/external/wpt/css/css-position-3/position-sticky-stacking-context-ref.html 0 → 100644
View file @ 262c6b42
<!DOCTYPE html>
<title>Reference for position: sticky should create a stacking context</title>
<style>
.indicator {
background-color: green;
}
.box {
width: 200px;
height: 200px;
}
</style>
<div class="indicator box"></div>
<div>You should see a single green box above. No red should be visible.</div>
third_party/WebKit/LayoutTests/external/wpt/css/css-position-3/position-sticky-stacking-context.html 0 → 100644
View file @ 262c6b42
<!DOCTYPE html>
<title>position: sticky should create a stacking context</title>
<link rel="match" href="position-sticky-stacking-context-ref.html" />
<link rel="help" href="https://www.w3.org/TR/css-position-3/#sticky-pos" />
<meta name="assert" content="position:sticky elements should create a stacking context" />
<style>
.indicator {
position: absolute;
background-color: green;
z-index: 1;
}
.sticky {
position: sticky;
z-index: 0;
}
.child {
position: relative;
background-color: red;
z-index: 2;
}
.box {
width: 200px;
height: 200px;
}
</style>
<div class="indicator box"></div>
<div class="sticky box">
<!-- Because sticky forms a stacking context, this child remains on bottom
even though it has a higher z-index than the indicator box. -->
<div class="child box"></div>
</div>
<div>You should see a single green box above. No red should be visible.</div>
third_party/WebKit/LayoutTests/fast/css/sticky/sticky-stacking-context-expected.html deleted 100644 → 0
View file @ 29b8809e
<!DOCTYPE html>
<script>
if (window.internals) {
internals.settings.setCSSStickyPositionEnabled(true);
}
</script>
<html>
<head>
<style>
body {
margin: 0;
}
.container {
width: 200px;
height: 400px;
outline: 2px solid black;
}
.box {
width: 200px;
height: 200px;
}
.sticky {
position: sticky;
}
.child {
position: relative;
background-color: green;
z-index: 2;
}
</style>
</head>
<body>
<div class="group">
<div class="container">
<div class="sticky box">
<div class="child box"></div>
</div>
</div>
</div>
</body>
</html>
third_party/WebKit/LayoutTests/fast/css/sticky/sticky-stacking-context.html deleted 100644 → 0
View file @ 29b8809e
<!DOCTYPE html>
<script>
if (window.internals) {
internals.settings.setCSSStickyPositionEnabled(true);
}
</script>
<html>
<head>
<style>
body {
margin: 0;
}
.container {
width: 200px;
height: 400px;
outline: 2px solid black;
}
.box {
width: 200px;
height: 200px;
}
.sticky {
position: sticky;
}
.intermediate {
position: absolute;
z-index: 1;
background-color: green
}
.child {
position: relative;
background-color: red;
z-index: 2;
}
.indicator {
position: absolute;
top: 0;
left: 0;
background-color: blue;
z-index: 0;
}
</style>
</head>
<body>
<div class="indicator box"></div>
<div class="container">
<div class="intermediate box"></div>
<div class="sticky box">
<div class="child box"></div>
</div>
</div>
</body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment