1 <!DOCTYPE html>
2 <html><head>
3 <title>CSS Test: Test for calc() on background-image gradients</title>
4 <link href="https://dbaron.org/" rel="author" title="L. David Baron">
5 <link href="http://www.w3.org/TR/css3-values/#calc-notation" rel="help">
6 <link href="reference/calc-background-image-gradient-1-ref.htm" rel="match">
7 <meta content="" name="flags">
8 <style type="text/css">
9
10 p {
11 height: 50px; width: 200px;
12 border: thin solid;
13 }
14
15 #one { background-image: radial-gradient(circle farthest-side at calc(50px + 50%) calc(100% - 30px), red, green); }
16
17 </style>
18 </head>
19 <body>
20 <p id="one"></p>
21
22
23 </body></html>