IE7 alignment problem

[jhdesigns]

Hiya,

Here’s the site:
http://www.thechildrensstoreinc.com/

It previews OK in IE8, Safari, FF, Chrome but not in IE7 (in particular – I can’t seem to remedy the big links to toys, kid’s toys and baby gifts in the blue gallery area or the address/info in header at top left).

I don’t even know how to describe the problem to be able to research a solution.

Also – I know I committed major CSS bad karma by using a table to align the links here but I couldn’t get a good alignment without doing so (I tried everything – absolute positioning, floats, divs, etc, etc).

Go ahead and hit me with your best shot – I need your help! Thank you!

[jamygolden]

I would give the header a set height instead of using margins to give it a height. Use as little margins as possible if you are looking for pixel perfect cross browser compatibility.

So, set:

.header{height: 300px; position: relative;}

.nav{position: relative; top: 115px;}

That should solve the problem and you should be able to figure out the rest from there.

[jhdesigns]

Thank you for this very helpful info! I’ve revised as you suggested. This helped with info in the header.
However, the links in the gallery (toys, kids’ gifts, baby gifts) are still not pixel perfect in IE7 (aok in FF, Safari, Chrome, IE8) – perhaps I need to do a separate stylesheet for IE7 for this section?
http://www.thechildrensstoreinc.com/fixit/
Thanks very much again for your help.

[Author]

Posts