Nifty rounded corners using html and css

Rounded border
HTML Code:

<b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b>
<div class="contentb">
<div>Round Border!!</div>
</div>
<b class="b4"></b><b class="b3"></b><b class="b2"></b><b class="b1"></b>

CSS Code:
.b1, .b2, .b3, .b4{font-size:1px; overflow:hidden; display:block;}
.b1 {height:1px; background:#888; margin:0 5px;}
.b2 {height:1px; background:#fff; border-right:2px solid #888; border-left:2px solid #888; margin:0 3px;}
.b3 {height:1px; background:#fff; border-right:1px solid #888; border-left:1px solid #888; margin:0 2px;}
.b4 {height:2px; background:#fff; border-right:1px solid #888; border-left:1px solid #888; margin:0 1px;}
.contentb {background: #fff; border-right:1px solid #888; border-left:1px solid #888;}
.contentb div {margin-left: 5px;}

Rounded Fill
HTML Code:

<b class="b1f"></b><b class="b2f"></b><b class="b3f"></b><b class="b4f"></b>
<div class="contentf">
<div>Round fill!!</div>
</div>
<b class="b4f"></b><b class="b3f"></b><b class="b2f"></b><b class="b1f"></b>

Css Code:
.b1f, .b2f, .b3f, .b4f{font-size:1px; overflow:hidden; display:block;}
.b1f {height:1px; background:#ddd; margin:0 5px;}
.b2f {height:1px; background:#ddd; margin:0 3px;}
.b3f {height:1px; background:#ddd; margin:0 2px;}
.b4f {height:2px; background:#ddd; margin:0 1px;}
.contentf {background: #ddd;}
.contentf div {margin-left: 5px;}

The first example will give you a rounded corner with border, simply copy the html and css code. The secound example will give you rounded corner with fill but will not have any border. You can custome the code by changing the border or background color.