bb53d89580
In bug 1156456 I landed tests with the transform in radians to work around float rounding issues with having the transform in degrees. This bug will fix the problems with degrees, so I'm duplicating the tests here to have variants with both degrees and radians.
47 lines
735 B
HTML
47 lines
735 B
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<title>Reftest, bug 1156456</title>
|
|
<style>
|
|
|
|
html, body {
|
|
height: 100%;
|
|
}
|
|
|
|
body {
|
|
background: white;
|
|
perspective: 1000px;
|
|
}
|
|
|
|
div, div::before, div::after {
|
|
width: 200px; height: 200px;
|
|
}
|
|
|
|
div {
|
|
position: absolute;
|
|
top: 0; right: 0; bottom: 0; left: 0;
|
|
margin: auto;
|
|
transform-origin: 50% 50% 100px;
|
|
background: #006;
|
|
transform: rotateY(-120deg) rotateX(60deg);
|
|
transform-style: preserve-3d;
|
|
}
|
|
|
|
div::before, div::after {
|
|
position: absolute;
|
|
top: 0; left: 0;
|
|
content: "";
|
|
}
|
|
|
|
div::before {
|
|
background: #00f;
|
|
transform: translate3D(100px, 0, 100px) rotateY(90deg);
|
|
}
|
|
|
|
div::after {
|
|
background: #00c;
|
|
transform: translate3D(0, -100px, 100px) rotateX(90deg);
|
|
}
|
|
|
|
</style>
|
|
<div></div>
|