| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title> | |
| CSS Values and Units Test: | |
| Range clamping into calc() expressions | |
| </title> | |
| <meta name="assert" content=" | |
| A calc expression can evaluate to a value which is outside the validity range. | |
| If it does, this value must be clamped into the range. | |
| The declaration must not be ignored. | |
| " /> | |
| <link | |
| rel="author" | |
| title="François REMY" | |
| href="mailto:fremycompany.developer@yahoo.fr" | |
| /> | |
| <link rel="help" href="http://www.w3.org/TR/css3-values/#calc-range"/> | |
| <link | |
| rel="match" | |
| href="reference/200-200-green.html" | |
| /> | |
| <style type="text/css"> | |
| html, body { margin: 0px; padding: 0px; } | |
| html { background: white; overflow: hidden; } | |
| #outer { background: green; width: 200px; height: 200px; } | |
| #outer { border-radius: 10px; border-radius: calc(-10px); } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="outer"></div> | |
| </body> | |
| </html> |