How to create a rounded corner of a background using CSS?

Question

How to create a rounded corner of a background using CSS?

Answer 1

Use this css:

.box_round { -moz-border-radius: 12px; /* FF1+ */ -webkit-border-radius: 12px; /* Saf3-4 */ border-radius: 12px; /* Opera 10.5, IE 9, Saf5, Chrome */ } 

And then just use the class in your HTML, like this

 <div class="box_round" style="background-color:red">This is a test</div> 

I added a background color: red - only for test dolls so you can see the rounded corneons.

NTN

Answer 2

This is only supported in CSS 3 .

Answer 3

Take a look at the CSS3 PIE project. This can help you with CSS3 related issues in older versions of IE.