Top Margin issue in IE7

[ekcetera]

I’m somewhat new to CSS, so forgive me if my code is hideous (tips always welcome!).

Can anyone tell my why I can’t seem to get IE7 to display the logo in the correct place? Here’s the URL: http://www.stylishspacesredecorating.com.

It seems to be correct in Firefox and IE8, but only when I set the top margin to -45px. So, that would make sense as to why in IE7, it pushes it up so far on the page.

I used to design a lot with tables, so broswer hacks weren’t necessary very much. So, I’m a little stumped as to what to do now.

Any help would be greatly appreciated!!

[ekcetera]

Here’s a screenshot of it in IE7 if you don’t have it. The logo is a transparent gif, so I erased some of it to get the rounded circle at the top – in case you’re wondering why the image looks goofy.

[ekcetera]

This put the logo in a much better spot, but now I’m trying to make minor adjustments to get the lines to line up on the outerwrapper. Here’s a new screenshot.

If you look closely, the top margin value I have to use to make the white outer border line up is -52px. This value puts it in a different spot in IE7 (up just a pixel or two too far). So, no matter what I do, one browser will always be off. Also, if you notice the top margin of the inner white wrapper is not showing 5 pixels of space on the top as it is on the side margins. These details are super picky, but critical.

So, it looks like I’ll have to have some separate code for IE7. How do I do this?

[Author]

Posts