blob: b47df834503621fccf526b821150e72815551302 [file] [log] [blame]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Perpsective Units</title>
<style type="text/css" media="screen">
.container {
display: inline-block;
height: 150px;
width: 200px;
margin: 10px 20px;
border: 1px solid black;
-webkit-perspective-origin: left top;
}
.content {
height: 100%;
width: 100%;
background-color: blue;
-webkit-transform: rotateX(45deg);
}
</style>
</head>
<body>
<p>-webkit-perspective should take units. All four should look qualitatively similar.</p>
<div class="container" style="-webkit-perspective: 400">
<div class="content">
</div>
</div>
<div class="container" style="-webkit-perspective: 400px">
<div class="content">
</div>
</div>
<div class="container" style="-webkit-perspective: 300pt">
<div class="content">
</div>
</div>
<br>
<div class="container" style="zoom: 2; -webkit-perspective: 400px">
<div class="content">
</div>
</div>
</body>
</html>