718521-ref.html (733B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Rounded rectangle clipping test</title> 5 <style> 6 .clipround { 7 left:100px; 8 top:100px; 9 position:absolute; 10 width:700px; 11 height:380px; 12 overflow:hidden; 13 border-radius:45px; 14 } 15 .greendiv { 16 width:300px; 17 height:230px; 18 background-color:#00ff00; 19 position:absolute; 20 } 21 #nrcDiv0 { 22 left:0px; 23 top:0px; 24 } 25 #nrcDiv1 { 26 left:320px; 27 top:0px; 28 } 29 #nrcDiv2 { 30 left:0px; 31 top:240px; 32 } 33 </style> 34 </head> 35 36 <body> 37 <div class="clipround"> 38 <div id="nrcDiv0" class="greendiv"></div> 39 </div> 40 <div class="clipround"> 41 <div id="nrcDiv1" class="greendiv"></div> 42 </div> 43 <div class="clipround"> 44 <div id="nrcDiv2" class="greendiv"></div> 45 </div> 46 </body> 47 </html>