OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <style> | 4 <style> |
5 #subPixelContainer { | 5 #subPixelContainer { |
6 width: 100.5px; | 6 width: 100.5px; |
7 height: 100px; | 7 height: 100px; |
8 position: relative; | 8 position: relative; |
9 } | 9 } |
10 #subPixelContainer > div { | 10 #subPixelContainer > div { |
11 position: absolute; | 11 position: absolute; |
12 width: 50px; | 12 width: 50px; |
13 right: 0px; | 13 right: 0px; |
14 height: 50px; | 14 height: 50px; |
15 background-color: red; | 15 background-color: red; |
16 » -webkit-transform: translateZ(0); | 16 » transform: translateZ(0); |
17 } | 17 } |
18 #test { | 18 #test { |
19 opacity: 0.99; | 19 opacity: 0.99; |
20 position: relative; | 20 position: relative; |
21 height: 50px; | 21 height: 50px; |
22 top: 0px; | 22 top: 0px; |
23 padding: 0; | 23 padding: 0; |
24 background-color: green; | 24 background-color: green; |
25 } | 25 } |
26 </style> | 26 </style> |
27 </head> | 27 </head> |
28 <body> | 28 <body> |
29 <div>This tests that transparency layers are properly aligned when on sub-pixel
offsets. You should see no red.</div> | 29 <div>This tests that transparency layers are properly aligned when on sub-pixel
offsets. You should see no red.</div> |
30 <div id="subPixelContainer"> | 30 <div id="subPixelContainer"> |
31 <div><div id="test"></div></div> | 31 <div><div id="test"></div></div> |
32 </div> | 32 </div> |
OLD | NEW |