Round Corners and Border-Radius in CSS3

The border-radius property is one of those CSS techniques that has been experimental for a few of the last releases of CSS.

It is now supported by the latest versions of all major browsers.

You can use it with or without adding a border to your page element.

You can use it on all or selected corners.

Use ems or pixels for the value of the radius.

Experiment.

Code and Examples

border-radius: 10px

border-radius: 20px 20px 0 0

border-radius: 0 0 30px 30px

border-radius: 25px; box-shadow: 5px 5px 10px #0e0e0e inset

See Also: Box Shadow

Have you tried our NEWEST template kit with scrolling columns? Download Template Kit #601 - 4 Page Kit or Test Drive It!