Rounded Corner In IE

[ryy705]

Hello,

 

Please take a look at http://www.jeanbrunone.com/ie/real.html.

 

I cannot get the rounded corners to line up correctly in IE. Please notice the woman's hair does not line up and misalignment in the navigation. 

 

For every element that needs rounded corners I have set the background to an image with two rounded corner at the bottom and created an empty div at the very beginning of the element with a class of "rndCap" and set its background to an image with two rounded corners at the top. You'll see this in real.html and ie.css.

 

I have been at it for days.  I read many tutorials.  Trial and error isn't working.  What I need is an experienced coder's help.  What do I need to do? Make the image bigger?Smaller?  Reset the margin?  I tried everything I could think of.  Many thanks in advance for helping me it is very much appreciated.

[haku]

It looks like you are using HTML 5 (either that or you have made a mistake in your doctype). I believe IE8 doesn't properly support HTML 5, so you are fighting a bit of a losing battle there.

[ryy705]

I tried xhtml 1.1 as well.  That did not make any difference.  I am screwing up the margin or image size somewhere.  But I can't figure out where.

[haku]

Which IE then?

[ryy705]

I was only interested in IE8.  I managed to line up everything by adjusting the width of the pictures.  It took me forever but it's done now.