animate-layer-scale-inherit-2.html (608B)
1 <!DOCTYPE HTML> 2 <title>Testcase, bug 1122526</title> 3 <style> 4 5 #outer, #inner { 6 display: inline-block; 7 background: white; 8 color: black; 9 } 10 #outer { transform: scale(5) } 11 #inner { animation: HoldTransform linear infinite 1s, 12 HoldOpacity linear infinite 1s; } 13 #inner { 14 vertical-align: top; 15 height: 100px; 16 width: 100px; 17 background: repeating-linear-gradient(to top left, yellow, blue 10px); 18 } 19 @keyframes HoldTransform { 20 from, to { transform: scale(0.2) } 21 } 22 @keyframes HoldOpacity { 23 from, to { opacity: 0.6 } 24 } 25 26 </style> 27 28 <div id="outer"> 29 <div id="inner"> 30 </div> 31 </div>