Link to home
Start Free TrialLog in
Avatar of leena42
leena42

asked on

Strange padding/margin in IE 7

please see the difference between ie7 and ie8.  Firefore, chrome and Opera generally are showing correctly, just IE 7 is giving me hassels.

I have a reset style sheet to help with styling across browers but looks like it's not helping for this. I tried googleing the float problem...added display:inline to the floated elemenets with no luck, so it took it off again.

you can see the code here test1.singulink.com

Please help me pin point the problem!  It's driving me up the wall !!!
ie7.png
Avatar of Carl Tawn
Carl Tawn
Flag of United Kingdom of Great Britain and Northern Ireland image

It's difficult to pin point anything purely from an image. Is the site available anywhere to view, or can you post the markup and styles?
Avatar of leena42
leena42

ASKER

Hi Carl_tawn, please check out test1.singulink.com (copy and past into browser)
Its a  line height thing.

First of all, line height should have some sort of measurement such as px or pt:

line-height: 25px;

Also, if you have a height on an element... I usually make the line-height the same.  so for your header, it's about 50-60px tall, so I would do this:

height: 50px;
line-height: 50px;
Avatar of leena42

ASKER

Thanks, designbyonyx.  I didn't set the height.  I wanted it to stretch based on what is in there.  So the Home banner image is bigger...

Anyway, there was a line-height that was in there for some reason, I thought it was good to be in there at the time... so now it's gone and I've just positioned the text absolutely.


However this hasn't fixed the problem I am having with the navigation.... any ideas for that?
With regards to the arrow... you have padding-top: 26px;

Instead of doing that, you want to remove the padding and use this instead:

bottom: 0;


However, you have some script which is moving the arrow.  The script is setting the CSS "top" property to 11px, which will prevent the suggestion I made with regards to "bottom" from working.  Can you modify that script that is moving the arrow?
ASKER CERTIFIED SOLUTION
Avatar of Designbyonyx
Designbyonyx
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of leena42

ASKER

That's beautiful... I was trying to do something like that because I don't have access to the orginal js file.
Avatar of leena42

ASKER

Thanks so much for your great ideas and all your help.