Con l'introduzione dei Css3 sono state inserite nuove proprietà che permettono di gestire e seguire i layout grafici in modo più preciso e veloce.

Se infatti prima, per inserire un qualsiasi elemento con angoli arrotondati bisognava ritagliare l'immagine oppure creare div vuoti con immagini di sfondo, oggi con una semplice regola dei css3 è possibile gestire i bordi dei div più facilmente.

La regola di base è questa:

border-radius: 5px;

Viene letta correttamente da tutte le versioni più recenti dei browsers :Firefox 4, Safari 5, Chrome 4.0+, Opera 10.5, Internet Explorer 9; per le versioni precedenti di Firefox, Safari e Chrome si può usare il corrispettivo -moz-border-radius e -webkit-border-radius in questo modo:

-moz-border-radius: 5px;
-webkit-border-radius: 5px;

dove la prima riga serve per far leggere la proprietà a Firefox mentre la seconda a Safari e Chrome.
La regola non viene minimamente presa in considerazione dalle versioni più vecchie di Internet Explorer (avevate dei dubbi?!!)

Volendo possiamo gestire anche un singolo bordo, oppure solamente quelli superiori o inferiori, in questo modo:
border-top-right-radius: per l'angolo superiore destro
border-top-left-radius: per l'angolo superiore sinistro
border-bottom-left-radius:per l'angolo inferiore sinistro
border-bottom-right-radius per l'angolo inferiore destro