Oct 2011 03

Creating CSS3 Rounded Corners For All Browsers0

Posted In Web Development

To add rounded corners to an element using CSS, just add the following code to your CSS

/* 4 rounded corners */
-webkit-border-radius: 10px; // for Safari and Chrome browsers
-khtml-border-radius: 10px; // for Konqueror browser
-moz-border-radius: 10px; // for Firefox browser
border-radius: 10px; // for browsers that support CSS 3

Of course, change the values (10px) to whatever value you want to change the corner radius.

If a browser doesn’t support rounded corners, it will just show square corners.

For more information, visit http://www.css3.info/preview/rounded-border/

Share

Leave a Comment