border-bottom-left-radius-005.xht (801B)
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <title>border-bottom-left-radius using two percentages</title> 4 <link rel="match" href="border-bottom-left-radius-005-ref.xht" /> 5 <link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-radius" /> 6 <meta name="fuzzy" content="maxDifference=0-1; totalPixels=0-1" /> 7 <style type="text/css"> 8 div 9 { 10 width: 200px; 11 height: 100px; 12 13 background: orange; 14 border: 20px solid teal; 15 border-bottom-left-radius: 20% 10%; 16 } 17 </style> 18 </head> 19 <body> 20 <p>The box should have a border-bottom-left-radius of 48px 14px. The 21 horizontal radius should therefore be clearly larger than the 22 vertical radius.</p> 23 <div></div> 24 </body> 25 </html>