The best way to add rounded corners using CSS and HTML

There are many ways out there to create simple rounded corners in CSS and HTML; however, some of them are combersome and they either take up a lot of code or they require you to use images. The easiest and best way that I have found for adding rounded corners to boxes in CSS (compatible with latest browsers) is the following:

Add this code to your style sheet:

#box
{
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
display:block;
background:#555555;
color:#fff;
padding:10px;
font-weight:bold;
}

Then you'll add the following html and you'll have rounded corners

<div id="box">
This way using -moz-border-radius: 5px, -webkit-border-radius: 5px, and border-radius: 5px will display a radius of 5 pixels around your block. Such as this surrounding div.
</div>