Cross-browser curved borders
- by Gandalf StormCrow
What is the best way to achieve cross-browser(ff,ie6,chrome,opera,safari) curved corners on a div. I found this article http://jonraasch.com/blog/css-rounded-corners-in-all-browsers and I've followed instructions step by step multiple times, here is my css :
#content_wrapper{
-moz-border-radius:25px 25px 25px 25px;
-webkit-border-radius: 25px;
-khtml-border-radius: 25px;
border-radius: 25px;
background-color:#F2DADC;
border:25px solid #ECD3D5;
height:780px;
opacity:0.7;
width:747px;
margin:0px auto;
position:relative;
display:block;
zoom:1;
}
<!--[if lte IE 8]>
<style>
#content_wrapper{
behavior: url(template/css/border-radius.htc);
border-radius: 20px;
}
</style>
<![endif]-->
Can somebody point me what am I doing wrong or is there a better way to achieve the same effect, its working in all browsers except in IE
