Creating a colorful rounded cornered Div

Rounded corner is one of the hottest topics in today’s web designing. Here you find a nice way of creating different colored rounded div. In my example, I have created one green and one yellow div.

The required css is

b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
h4,p{margin: 0 10px}

/*for yellow div*/
div#yellow_div{
margin: 0 5%;
background: #F7FC62;           
/*change color here to get a different color div */
}
b.rtop_yellow, b.rbottom_yellow{display:block;background: #FFF}
b.rtop_yellow b, b.rbottom_yellow b{display:block;height: 1px;
overflow: hidden; background: #F7FC62}                                      
/*change color here to get a different colored div */
b.rtop_yellow b.r4, b.rbottom_yellow b.r4{margin: 0 1px;
height: 2px}

/*for green div*/
div# green_div{
margin: 0 5%;
background: #8FFF63;                 
/*color changed  */
}
b.rtop_green, b.rbottom_green{display:block;background: #FFF}
b.rtop_green b, b.rbottom_green b{display:block;height: 1px;
overflow: hidden; background: #8FFF63}                                   
/*color changed */
b.rtop_green b.r4, b.rbottom_green b.r4{margin: 0 1px;
height: 2px}

Now you will find how to use this css to create two colorful div

<div id=" yellow_div " style="width:250px; ">
<b class="rtop_yellow"><b class="r1"></b><b class="r2"></b><b class="r3"></b>
<b class="r4"></b></b>
    place your content here<br>
   place your content here<br>
   place your content here<br>
<b class="rbottom_yellow"><b class="r4"></b><b class="r3"></b><b class="r2">
</b><b class="r1"></b></b>
</div>
<br>
<div id=" green_div " style="width:250px; ">
<b class="rtop_green"><b class="r1"></b><b class="r2"></b><b class="r3">
</b><b class="r4"></b></b>
   place your content here<br>
   place your content here<br>
   place your content here<br>
<b class="rbottom_green"><b class="r4"></b><b class="r3"></b><b class="r2">
</b><b class="r1"></b></b>
</div>

The result will be like this.



You can easily create you own color div just by changing the color in css I mentioned above
and use that name in div id and class attribute of b tag.