Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-10 07:55:33 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update CSS tests to revision 31d63cc79bd4c929ed582229e936d7b389f3e6ab

Browse source
This commit is contained in:
James Graham 2015-03-27 09:18:12 +00:00
parent 1a81b18b9f
commit 2c9faf5363
91915 changed files with 5979820 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

60
tests/wpt/css-tests/css-regions-1_dev/html/regions-transforms-019.htm Normal file
View file

@ -0,0 +1,60 @@
<!DOCTYPE html>
<html><head>
<title>CSS Regions: 3D transform on named flow (text) content with perspective property set on region</title>
<link href="mailto:mibalan@adobe.com" rel="author" title="Mihai Balan">
<link href="http://www.w3.org/TR/css3-regions/#the-flow-into-property" rel="help">
<link href="http://www.w3.org/TR/css3-regions/#the-flow-from-property" rel="help">
<link href="http://www.w3.org/TR/css-transforms-1/#three-d-transform-functions" rel="help">
<link href="http://www.w3.org/TR/css-transforms-1/#perspective-property" rel="help">
<link href="http://www.w3.org/TR/css-transforms-1/#perspective-origin-property" rel="help">
<!-- TODO: Link to fragmentation spec section about perspective, fragments and fragmentainers -
once this gets in the spec. -->
<meta content="Test checks that the 3D transform is applied named content flow, that the
perspective set on the region is applied, and that the content is not clipped when
the perspective is shifted" name="assert">
<meta content="ahem" name="flags">
<link href="reference/regions-transforms-019-ref.htm" rel="match">
<style>
.ahem {
font-family: Ahem;
font-size: 20px;
line-height: 1em;
}
#named-flow {
flow-into: f;
transform: rotateY(45deg);
color: green;
}
#region {
flow-from: f;
perspective: 200px;
perspective-origin: 100% 50%;
width: 100px;
height: 100px;
margin: 20px;
}
/* Adding a red div that will be covered by the properly transformed
element with the perspective respected */
#failure {
position: absolute;
left: 25px;
width: 10px;
height: 112px;
background-color: red;
z-index: -1;
}
</style>
</head>
<body>
<p>Test passes if you see a green trapezoid and no red.</p>
<div id="failure"></div>
<div class="ahem" id="named-flow">
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
xxxxx<br>
</div>
<div id="region"></div>
</body></html>