Met de komst van CSS3 is het mogelijk via CSS ronde hoeken te bepalen voor elementen, momenteel hebben enkel FireFox/Mozilla en Safari 3 deze optie geïntrigeerd.
Andere browsers zullen het dus voorlopig nog zonder moeten doen, maar hoe gebruik je nu border-radius?

CSS3 (nog niet klaar!!)

CSS

#foo {
border-top-right-radius: 10px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-top-left-radius: 10px;
}
#foo {
border-radius: 5px; /*alle hoeken hetzelfde*/
}

Safari/webkit

CSS

#faa {
webkit-border-top-right-radius: 10px;
webkit-border-bottom-right-radius: 5px;
webkit-border-bottom-left-radius: 5px;
webkit-border-top-left-radius: 10px;
}
#faa {
webkit-border-radius: 5px; /*alle hoeken hetzelfde*/
}

FireFox/Mozilla

CSS

#fee {
moz-border-radius-topright: 10px;
moz-border-radius-bottomright: 5px;
moz-border-radius-bottomleft: 5px;
moz-border-radius-topleft: 10px;
}
#fee {
moz-border-radius: 5px; /*alle hoeken hetzelfde*/
}