| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 | 2 |
| 3 <html> | 3 <html> |
| 4 <head> | 4 <head> |
| 5 <style type="text/css" media="screen"> | 5 <style type="text/css" media="screen"> |
| 6 body { | 6 body { |
| 7 position: relative; | 7 position: relative; |
| 8 } | 8 } |
| 9 .container { | 9 .container { |
| 10 position: relative; | 10 position: relative; |
| 11 width: 100px; | 11 width: 100px; |
| 12 height: 100px; | 12 height: 100px; |
| 13 padding: 20px; | 13 padding: 20px; |
| 14 z-index: 0; | 14 z-index: 0; |
| 15 border: 1px solid black; | 15 border: 1px solid black; |
| 16 } | 16 } |
| 17 | 17 |
| 18 .compositing { | 18 .compositing { |
| 19 position: absolute; | 19 position: absolute; |
| 20 top: 21px; | 20 top: 21px; |
| 21 left: 21px; | 21 left: 21px; |
| 22 width: 100px; | 22 width: 100px; |
| 23 height: 100px; | 23 height: 100px; |
| 24 -webkit-transform: translateZ(0); | 24 transform: translateZ(0); |
| 25 } | 25 } |
| 26 | 26 |
| 27 #far-left { | 27 #far-left { |
| 28 position: relative; | 28 position: relative; |
| 29 left: -1000px; | 29 left: -1000px; |
| 30 width: 1200px; | 30 width: 1200px; |
| 31 height: 100px; | 31 height: 100px; |
| 32 background-color: green; | 32 background-color: green; |
| 33 } | 33 } |
| 34 | 34 |
| 35 #far-left.moved { | 35 #far-left.moved { |
| 36 -webkit-transform: translateX(200px); | 36 transform: translateX(200px); |
| 37 } | 37 } |
| 38 | 38 |
| 39 .indicator { | 39 .indicator { |
| 40 position: absolute; | 40 position: absolute; |
| 41 top: 21px; | 41 top: 21px; |
| 42 left: 21px; | 42 left: 21px; |
| 43 width: 100px; | 43 width: 100px; |
| 44 height: 100px; | 44 height: 100px; |
| 45 background-color: red; | 45 background-color: red; |
| 46 } | 46 } |
| (...skipping 28 matching lines...) Expand all Loading... |
| 75 <!-- The green layer should extend to the left edge of the page --> | 75 <!-- The green layer should extend to the left edge of the page --> |
| 76 <div class="container"> | 76 <div class="container"> |
| 77 <div id="far-left"> | 77 <div id="far-left"> |
| 78 Text here | 78 Text here |
| 79 </div> | 79 </div> |
| 80 </div> | 80 </div> |
| 81 <pre id="layers">Layer tree goes here in DRT</pre> | 81 <pre id="layers">Layer tree goes here in DRT</pre> |
| 82 </body> | 82 </body> |
| 83 </html> | 83 </html> |
| 84 | 84 |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 637763002:
Unprefix usage of -webkit-transform in tests (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master