multicol-gap-animation-003.html (1128B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Multi-column Layout Test: Default column-gap test animation</title> 4 <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com"> 5 <link rel="help" href="https://www.w3.org/TR/css-multicol-1/#column-gap"> 6 <link rel="help" href="https://www.w3.org/TR/web-animations-1/#dom-animatable-animate"> 7 <meta name="assert" content="Test checks that the default value for column-gap property, which is 'normal', is not interpolable."> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <style> 11 @keyframes column-gap-to-100 { 12 to { column-gap: 100px; } 13 } 14 15 #multicol { 16 animation-name: column-gap-to-100; 17 animation-duration: 2s; 18 animation-delay: -1s; 19 animation-play-state: paused; 20 } 21 </style> 22 <body> 23 <div id="multicol"></div> 24 <div id="log"></div> 25 26 <script> 27 test( 28 function(){ 29 var multicol = document.getElementById("multicol"); 30 assert_equals(getComputedStyle(multicol).columnGap, "100px"); 31 }, "Default column-gap is not interpolable"); 32 </script> 33 </body>