Rounded Corner Border mainWrapper

[clydejones]

Hello I am trying to get a rounded corner around #mainWrapper, have been working on it all day being very unsucessful, I would prefer it to be css but if there is a easier way I will do it images, but not sure how to divide the images top/header middle and then the footer, not sure were to place the div id if that what you would do, recommendations? I have tried nifty template, not what I am looking for to much I would have to alter.

You could add the following to your #mainWrapper declaration:

border:2px solid #DEDFDF;
border-width: 2px 2px 0 2px;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
border-top-left-radius:10px;
border-top-left-radius:10px;

This will provide rounded corners in FF Safari and Chrome; but will render as square cornered in IE7/8 and Opera.