Hi,

 

I have coded a static website for a client (Client designed the PSD), and have gotten this feedback:

 

However in IE (7 and the navigation text is stretching too far across so the Contact Us text is merging with the Search text. I tried reducing the font size and it's fine on every other browser except IE

 

I cannot see any issues using IE9, 8 or 7 on my machine. I even tried it in IE Tester - all looks good for me?!

 

Could someone take a quick look in IE7/8 for me and see if they are having the above issue please? Or suggestions as to why they can see this problem.

 

 

Here's the URL (Sorry dont want to post direct link) http://79.170.44.78/testhousedirectory.com/

 

Thanks in advance

 

Huw

Fine here in IE8 on both Vista and 7.

can't see any issues either. Well only that it's wider than 1024 but nothing like they've described.

 

IE6 attached if that's an issue

Fine here in IE8 on both Vista and 7.

 

Thanks Mike. +1 for helping me out.

haven't tried IE9 yet though, on a different PC

can't see any issues either. Well only that it's wider than 1024 but nothing like they've described.

 

IE6 attached if that's an issue

 

IE6 not required, and had to use the design provided which is why it's wider than usual!

 

Thanks for the input.

Hey mate the issue is IE6 as pointed out above but works fine in 7 8 9 on Windows 7.

maybe worth asking them to CTRl-F5 just in case they're loading up an old css or something.

Hey mate the issue is IE6 as pointed out above but works fine in 7 8 9 on Windows 7.

 

Thanks.

 

Wondering why they can see it and we can't??? Any ideas?

Have they sent you a screenshot of the problem?

I'd guess there machine is displaying in quirks mode maybe?

 

Try giving your #search width:240px;

Have they sent you a screenshot of the problem?

 

No - Will have to request.

I'd guess there machine is displaying in quirks mode maybe?

 

Try giving your #search width:240px;

 

Thanks MTeam for the suggestion. Will try adding that CSS too.

Maybe they have their text size increased in their browser. Some people do that and leave it like that permanently so it's always good to test your sites up and down a couple of notches.

Here is a screenshot of FF4 on mac with text zoom up x 3

Looks like what you described.

Here is a screenshot of FF4 on mac with text zoom up x 3

Looks like what you described.

 

I think you maybe right there.

 

How can i fix this? Cant seem to find a tut/article on this.

There are a few options but they aren't very nice.

 

1) Tell him he's the only nutter that zooms his text in that much

2) make the font-size smaller and the padding between each item less until it looks fine on his (and tiny on everyone elses)

3) - the one I would go for - give your nav container a fixed width so that it can't ever overlap the search box, but no fixed height so when you zoom the text the nav links will start a new line.

 

A combination of all 3 may be your best bet though

Actually, I'm a bit rusty on the old font zooming of IE but I think giving the font-size of the nav in px or pt as oppose to em or % may stop it resizing in IE. Not too sure though.

Actually, I'm a bit rusty on the old font zooming of IE but I think giving the font-size of the nav in px or pt as oppose to em or % may stop it resizing in IE. Not too sure though.

 

Font-size is in px already.

 

Will try option 3 above, and hint at option 1!

 

Thanks

I think Blofeld has got it

 

I dont know how thats happening because IE doesnt usually resize text with fontsize in px

Edited May 13, 201115 yr by mteam

doesn't change at all when you change the Text Size in IE. The only way I could get it was to go into Internet Options/Accessibility and click the "Ignore font sizes on websites" and then change the Text Size (under Page). Then it looks like the attached.

I'm willing to bet they don't have Myriad Pro, your first font in the stack. When they visit the site they see Verdana being used, a MUCH wider font. In Firebug on FF4/W7 I turned the font in the nav to Verdana and it almost overlapped. It's probably a combination of factors that would make it overlap.

 

Most non-designers don't have Myriad Pro, so you might want to put "Myriad" into your font stack (after Pro). More people will have that, but you still need to resolve the Verdana issue.