CSS Rounded Corners

I have been creating my own rounded corners using a table structure and 6 images on a couple of web sites that we are building. But I started to wonder if there was an easier way to round corners without all the images and etc. Today I came across benogle and his CSS Rounded Corners demonstration which is one really nice way to create what used to require quite a bit of image slicing.

He creates a number of classes with each class having a slightly smaller margin. Then combine the different classes utilizing a bold tag with the content in div tags. Here is a simple example:

.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;}

<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>