Update web-platform-tests to revision 58b72393db0bd273bb93268c33666cf893feb985

This commit is contained in:
Josh Matthews 2017-10-31 08:58:31 -04:00
parent 43a4f01647
commit 64e0a52537
12717 changed files with 59835 additions and 59820 deletions

View file

@ -0,0 +1,106 @@
<!DOCTYPE html>
<html>
<head>
<title>CSS Regions: painting order for fragmented floats that are stacking contexts</title>
<link rel="author" title="Mihai Balan" href="mailto:mibalan@adobe.com">
<link rel="help" href="http://www.w3.org/TR/css3-regions/#the-flow-into-property">
<meta name="flags" content="ahem">
<meta name="assert" content="Test checks that floats inside a named flow that also create a
stacking context respect the correct painting order even when fragmented across
multiple regions that are overlapping.">
<link rel="match" href="reference/floats-in-named-flow-026-ref.html">
<style>
article {
font-family: Ahem;
font-size: 20px;
line-height: 1em;
}
.flow {
flow-into: f;
}
.float {
float: left;
position: relative;
z-index: 1;
}
.back {
color: green;
position: relative;
z-index: 10;
}
.front {
color: red;
z-index: 20;
}
.content {
color: blue;
}
.region {
/* The region is 115px tall to catch bugs where the floats would be
sliced rather than properly fragmented */
height: 115px;
flow-from: f;
}
.shifted {
position: relative;
/* See the above comment about the region height */
top: -115px;
}
.region > p {
background: red;
}
</style>
</head>
<body>
<p>
Test passes if you see two squares, side by side horizontally. The left square should
be green, the right one should be blue and they should be flush to one another.<br>
You should see no red.
</p>
<div class="region">
<p>&nbsp;</p>
</div>
<div class="shifted region">
<p>&nbsp;</p>
</div>
<article class="flow">
<div class="float">
<span class="front">
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
</span>
<span class="back">
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx
</span>
</div>
<div class="content">
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx
</div>
</article>
</body>
</html>