Question

I would like to use CSS to create nice round border. I’m aware of the following CSS Style:

 border-radius
-webkit-border-radius
-moz-border-radius

Which style(s) are the best to use?

Answer 1

/* Gecko browsers */
-moz-border-radius: 5px; 
/* Webkit browsers */
-webkit-border-radius: 5px; 
/* W3C syntax - likely to be standard so use for future proofing */
border-radius: 5px;

Internet Explorer 6 & 7 and 8 (as far as I know) and Opera do not support rounded corners. Instead these users will see a regular corner.

You can get started using Firefox and any of the ‘Mozilla’ family of browsers. Apple’s WebKit web browser engine also supports rounded corners making them available in the Safari and Chrome web browsers, the iPhone and other devices running WebKit.

Detailed Answer of your question is here

http://shapeshed.com/journal/css3_tour_border-radius/

and for IE use these solution
http://woork.blogspot.com/2009/08/css3-rounded-corners-for-every-browser.html

http://www.css3.info/a-border-radius-solution/

see some more cool info here about corners
http://www.the-art-of-web.com/css/border-radius/