The IE6 "jumping text" problem

[ChrisTheSoul]

Can someone take a look at the attached in IE6 please?

www.slightlyaskew.co.uk/polstar

Any ideas why the text "jumps" up after you hover over a link?

I'm sure it doesn't do it in IE7 / FF, but I stand to be corrected.

Thank you.

[Emzi]

Hmm, I see what you mean.

Maybe change the padding-top on the class #logo to a fixed pixel size rather than a percentage?

Not sure how or why it's a problem though, it works fine in IE 7.

[ChrisTheSoul]

Hi Emzi, cheers for that.

Yes, I suspect it is do with the 10% padding, but I have no idea why it changes. I'm curious as to how to IE6 is interpreting it before and after the rollover.

Any IE6 gurus out there?

[Marc]

It does not seem to jump for me in FF or IE6.

[welshstew]

try using margin-top instead. ie6 seems to double whatever padding you put in

[Monie]

I hate IE!

[Jack Franklin]

For me when I hover the first time it moves up the page but then stays still. Can you post the CSS please? Try putting display:block in the link styles on the normal and hover styles.

a:link {
display: block;
}

a:hover {
display: block;
}

Jack

[ChrisTheSoul]

Thanks for everyone for their responses.

Stew, changing to margin-top seems to make it work. However, you say padding gets doubled in IE. When I change it to margin, the original position is the same. It doesn't jump however when you hover over the the links.

So is the hover causing the padding to half?

Bizarre.

[Jack Franklin]

That's IE for you! Ha!

[ChrisTheSoul]

Well that's the problem Jack: it's not just me - it's the 35% of internet users who still use IE6.