calc-rgb-percent-001.html (988B)
1 <!DOCTYPE html> 2 3 <meta charset="UTF-8"> 4 5 <title>CSS Values Test: computed value of rgb() with calc(percentage)</title> 6 7 <!-- 8 9 Original code is from Yves Lafon 10 11 Re: [css3-values] percentage in calc() and attr() 12 https://lists.w3.org/Archives/Public/www-style/2016May/0028.html 13 14 --> 15 16 <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> 17 <link rel="help" href="https://www.w3.org/TR/css-values-3/#calc-notation"> 18 19 <script src="/resources/testharness.js"></script> 20 21 <script src="/resources/testharnessreport.js"></script> 22 23 <style> 24 div#target 25 { 26 background-color: rgb(calc(5% + 15%), calc(40% / 2), calc(5% * 4)); 27 height: 100px; 28 } 29 </style> 30 31 <div id="target"></div> 32 33 <script> 34 test(function() 35 { 36 assert_equals(getComputedStyle(document.getElementById("target")).backgroundColor, "rgb(51, 51, 51)"); 37 }, "testing rgb(calc(5% + 15%), calc(40% / 2), calc(5% * 4))"); 38 </script>