Rounded Corners In Css With Ie

[JurgenDoe]

CSS 3 has nice tag to draw rounded border of HTML elements using border-radius tag:

-moz-border-radius: 5px;

-webkit-border-radius: 5px;

Unfortunately, these tags are supported for Mozilla/Firefox and Safari 3. Users of IE 6 and IE7 wont see the radius. Classical way to support Rounded corners in IE is to craft corner images. On practice it means we should have double CSS code: one with CSS3 support and other for IE.

We solved double CSS issue with JavaScript code. We found nice jQuery plugin - Curvy Corners. We single CSS code with radius tag and rest of work made by Curvy Corners. Usblocking.com designers simply specify CSS tag like:

#intro{

-moz-border-radius-bottomleft : 8px;

-webkit-border-bottom-left-radius: 8px;

-moz-border-radius-bottomright : 8px;

-webkit-border-bottom-right-radius: 8px;

}

Good thing this method works for all major IE versions as well as Firefox.

Dunno why ... but I get some CSS errors here using the -moz-border-radius-bottomright: 8px

[JurgenDoe]

Dunno why ... but I get some CSS errors here using the -moz-border-radius-bottomright: 8px

it should not be CSS errors. Firefox should use it and IE ignores.

I know ... get the css error in IE ... I'm testing always in IE too because this browser sucks