CSS Curve using images
To create CSS Curve for menu bar like show below.
We need following three images.
curve_left.png
curve_bg.png
curve_right.png
CSS
.curve { background:url(images/curve_bg.png) repeat-x; width:800px; height:35px; }
.curve .fl {display:block; background:url(images/curve_left.png) no-repeat; width:11px; height:12px;}
.curve .fr {display:block; background:url(images/curve_right.png) no-repeat; background-position:right top;width:11px; height:12px;}
HTML
<div class=”curve”> <span class=”fl”></span><span class=”fr”></span>