Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(67)

Side by Side Diff: third_party/WebKit/LayoutTests/transforms/rotate.html

Issue 2531753002: CSS Independent Transform Properties: support rotate: <axes> <angle> (Closed)
Patch Set: tests Created 4 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <style> 2 <style>
3 div { 3 div {
4 width: 100px; 4 width: 100px;
5 height: 100px; 5 height: 100px;
6 background-color: blue; 6 background-color: blue;
7 transform-origin: 50% 50%; 7 transform-origin: 50% 50%;
8 } 8 }
9 .container { 9 .container {
10 rotate: 45deg; 10 rotate: 45deg;
11 background-color: red; 11 background-color: red;
12 perspective-origin: 150% 150%; 12 perspective-origin: 150% 150%;
13 perspective: 500px; 13 perspective: 500px;
14 } 14 }
15 #box1 { 15 #box1 {
16 rotate: inherit; 16 rotate: inherit;
17 } 17 }
18 #box2 { 18 #box2 {
19 transform: translate(200px); 19 transform: translate(200px);
20 rotate: 50deg 1 0 0; 20 rotate: 1 0 0 50deg;
21 } 21 }
22 #box3 { 22 #box3 {
23 transform: translate(200px); 23 transform: translate(200px);
24 rotate: 30deg 1 -2.5 4; 24 rotate: 1 -2.5 4 30deg;
25 } 25 }
26 #box4 { 26 #box4 {
27 rotate: 45deg 0 0 0; 27 rotate: 0 0 0 45deg;
28 } 28 }
29 </style> 29 </style>
30 30
31 <div class="container"> 31 <div class="container">
32 <div id="box1">1</div> 32 <div id="box1">1</div>
33 <div id="box2">2</div> 33 <div id="box2">2</div>
34 </div> 34 </div>
35 <div id="box3">3</div> 35 <div id="box3">3</div>
36 <div id="box4">4</div> 36 <div id="box4">4</div>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698