stacking-context-opacity-1-with-fill-forwards.html 429 B

12345678910111213141516171819202122232425
  1. <!DOCTYPE html>
  2. <title>
  3. Opacity animation does not destroy stacking context when the animation
  4. has finished but has fill:forwards
  5. </title>
  6. <style>
  7. span {
  8. height: 100px;
  9. width: 100px;
  10. position: fixed;
  11. background: green;
  12. top: 50px;
  13. }
  14. @keyframes Opaque {
  15. from, to { opacity: 1 }
  16. }
  17. #test {
  18. width: 100px; height: 100px;
  19. background: blue;
  20. animation: Opaque 0s forwards;
  21. }
  22. </style>
  23. <span></span>
  24. <div id="test"></div>