mq-calc-sign-function-006.html (700B)
1 <!doctype html> 2 <title>Test: support for calc with sign() in Media Queries</title> 3 <link rel="author" title="Daniil Sakhapov" href="mailto:sakhapov@chromium.org"> 4 <link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation"> 5 <link rel="help" href="http://www.w3.org/TR/css3-mediaqueries/#units"> 6 <link rel="match" href="../reference/ref-filled-green-100px-square.xht"> 7 <style> 8 :root { 9 font-size: 16px; 10 } 11 div { 12 width: 100px; 13 height: 100px; 14 background-color: green; 15 } 16 17 @media (grid: calc(2 * sign(17px - 1rem))) { 18 div { 19 background-color: red; 20 } 21 } 22 </style> 23 <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> 24 <div></div>