percent-2.html (1059B)
1 <!doctype html> 2 <html><head><title>Border radius with percent units — test</title> 3 <style> 4 div { border-radius: 25% 10%; background: green; } 5 .r1 { height: 20px; } .c1 { width: 20px; } 6 .r2 { height: 40px; } .c2 { width: 40px; } 7 .r3 { height: 60px; } .c3 { width: 60px; } 8 .r4 { height: 80px; } .c4 { width: 80px; } 9 </style> 10 </head><body> 11 <table> 12 <tr> 13 <td><div class="r1 c1"></div></td> 14 <td><div class="r1 c2"></div></td> 15 <td><div class="r1 c3"></div></td> 16 <td><div class="r1 c4"></div></td> 17 </tr> 18 <tr> 19 <td><div class="r2 c1"></div></td> 20 <td><div class="r2 c2"></div></td> 21 <td><div class="r2 c3"></div></td> 22 <td><div class="r2 c4"></div></td> 23 </tr> 24 <tr> 25 <td><div class="r3 c1"></div></td> 26 <td><div class="r3 c2"></div></td> 27 <td><div class="r3 c3"></div></td> 28 <td><div class="r3 c4"></div></td> 29 </tr> 30 <tr> 31 <td><div class="r4 c1"></div></td> 32 <td><div class="r4 c2"></div></td> 33 <td><div class="r4 c3"></div></td> 34 <td><div class="r4 c4"></div></td> 35 </tr> 36 </table> 37 </body></html>