Positioning of rounded edge css elements

[Njilski]

Hi there.

I'm currently developing a website, where i'm using the following css to make rounded edges:

-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-khtml-border-radius: 7px;
behavior: url(/tl_files/eden_park/frame/border-radius.htc);
border-radius: 7px;

I know the "border-radius" code will work in most browsers like firefox, chrome etc, but the famous problem-child IE has a little problem. The way of converting and making the rounded corners by using the .htc file works fine, but the positioning of the rounded edges has some kind of error in IE. Looks like it maybe could be a "absolute / relative" problem, but does anyone know how I could solve this?

I've taken a screenshot of the problem, which could be found here:
http://www.bocomfort.dk/tl_files/eden_park/problem.jpg

If anyone knows how I can correct this error I would very much appreciate it.

Best regards
Andreas

[Ruud]

Your best option starts with viewing IE as an important browser (that has bugs just like firefox and chrome and the rest). It is not a problem child. Sorry, this is a discussion on its own...

Then instead of using non standards-based non-future-proof options, you'd be better of for the time being by using methods that all the browsers of today can handle. It will probably save lots of time.

In my opinion it is wise to start using new CSS techniques if they are widely supported. I can't wait untill CSS3 is fully built into all major browsers and the older versions are only a small portion left on the web.