Rounded corners by using CSS sprite

To make a division which has rounded corners this stylesheet is used.

/* First part can also be used inline styling */
.graybox{background-image: url('images/graybox.png');background-color: #e4e4e4;}
.grayboxContent{width: 600px;}
.top{width: 590px;}
.center{width: 600px;}
.bottom{width: 590px;}

/* Second part is common settings */
.grayboxContent{float: left;background-repeat: no-repeat;}
.graybox{float: left;background-repeat: no-repeat;}
.topLeft{width: 5px;height: 5px;background-position: 0px 0px;}
.top{height: 5px;background-image: none;}
.topRight{width: 5px;height: 5px;background-position: -5px 0px;}
.center{background-image: none;}
.bottomLeft{width: 5px;height: 5px;background-position: 0px -5px;}
.bottom{height: 5px;background-image: none;}
.bottomRight{width: 5px;height: 5px;background-position: -5px -5px;}


And this division positioning is used.

<div class="grayboxContent">
<div class="graybox topLeft"></div>
<div class="graybox top"></div>
<div class="graybox topRight"></div>
<div class="graybox center">
Selim
</div>
<div class="graybox bottomLeft"></div>
<div class="graybox bottom"></div>
<div class="graybox bottomRight"></div>
</div>

This image should be in the folder images

->

So it is ready to use.