Border-radius özelliği ile oluşturduğumuz div kutularımızın köşelerini oval (yuvarlak) yapabiliriz. Tarayıcalarda farklı türde çalışır.
Opera ve Internet Explorer 9+ için
.oval { border-radius: border-radius:10px 10px 10px 10px; }
Chrome ve Safari için
.oval { -webkit-border-radius: 10px 10px 10px 10px; }
Firefox için
.oval { -moz-border-radius: 10px 10px 10px 10px; }
<style>
.oval{
color:#600;
font-size:20px;
width:250px;
height:30px;
line-height:30px;
text-align:center;
border:1px solid #000;
margin:2px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
</style>
<div class="oval">Border-Radius</div>