<html>
<head>
<style>
div.container
{
flow:horizontal-flow;
width:*;
margin: 10px;
padding:10px;
border-spacing:10px;
}
#mono-color
{
border-color:black;
}
#var-colors
{
border-color:red gold green blue;
}
#fill-no-borders
{
border-style:none;
}
#fill-borders
{
border-color:black;
}
div.case1
{
width:10%;
height:60px;
padding: 10px;
border:1px solid;
border-radius:7px;
}
div.case2
{
width:10%;
height:60px;
padding: 10px;
border:3px solid;
border-radius:10%;
}
div.case3
{
width:10%;
height:60px;
padding: 10px;
border:3px solid;
border-radius:20% / height(20%);
}
</style>
</head>
<body style="background-color: #3E3E3D00;">
<H1>border-radius css attribute support</H1>
<div .container >
<div .case1 #mono-color> case 1 </div>
<div .case2 #mono-color> case 1 </div>
<div .case3 #mono-color> case 1 </div>
<div .case1 #var-colors> case 1 </div>
<div .case2 #var-colors> case 1 </div>
<div .case3 #var-colors> case 1 </div>
</div>
</body>
</html> | 
