css corner

/** rounded corners **/

/* curved */
.bl { background: url(../images/j_crn_bl_light.png) 0 100% no-repeat;}
.br { background: url(../images/j_crn_br_light.png) 100% 100% no-repeat;}
.tl { background: url(../images/j_crn_tl_light.png) 0 0 no-repeat; }
.tr { background: url(../images/j_crn_tr_light.png) 100% 0 no-repeat;}
.bt { background:url(../images/j_border.png) 0 0 repeat-x; }
.dl{ background:url(../images/mw_line_grey.png) 0 0 repeat-y;}
.dr { background:url(../images/mw_line_grey.png) 100% 100% repeat-y;}
.bb { background:url(../images/j_border.png) 0 100% repeat-x; }

/* header red background curved */



HTML 


<div class="bb"> <div class="dl"><div class="bl"><div class="dr"><div class="br"><div class="bt"><div class="tl"><div class="tr">
 
<!-- search -->
 		<span> Text here</span><br /><br />
 
                 text here text here  
 </div></div></div></div></div></div></div></div>

css elastic rounded border

css

CSS