calc-in-calc.html (783B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title> 6 CSS Values and Units Test: 7 Calc() inside calc() 8 </title> 9 <meta name="assert" content=" 10 The calc() function notation is allowed inside a calc() notation. 11 " /> 12 13 <link 14 rel="author" 15 title="François REMY" 16 href="mailto:fremycompany.developer@yahoo.fr" 17 / > 18 19 <link rel="help" href="http://www.w3.org/TR/css3-values/#calc-notation"/> 20 21 <link 22 rel="match" 23 href="reference/all-green.html" 24 /> 25 26 <style type="text/css"> 27 28 html, body { margin: 0px; padding: 0px; } 29 30 html { background: red; overflow: hidden; } 31 #outer { position: absolute; top: 0px; left: 0px; background: green; width: 100%; } 32 #outer { height: calc(calc(100%)); } 33 34 </style> 35 36 </head> 37 <body> 38 39 <div id="outer"></div> 40 41 </body> 42 </html>