Works in everything.bar Mac FF3.5

[QED Motorsport]

Hi all,

Got a random bug with the CSS on our site. I used Son Of Suckerfish to create a flyout menu. The <ul> nest sits in a <div>. If a height is not set for this <div>, FF3.5 (on the PC at least) hides the <div> but not the <ul> nest and div below gets shifted the the side. Fine, ok, I set a height and it works in IE6/7/8, Opera 9.6, Chrome, FF3.5, Safari....but not in the mac ver of FF3.5, it seems to ignore the height.

I don't have a mac to try fix the issue on so would appreciate it if anyone with a Mac and FF3.5 could take a look and advise what might be causing the issue?

Site: <snip>

TIA!

[edited by: swa66 at 12:00 pm (utc) on July 15, 2009]
[edit reason] No URLs please see ToS and forum charter [/edit]

[swa66]

I'd suggest to first check if your code validates.

[jameshopkins]

I'd suggest to first check if your code validates.

It does (I checked it before you removed the link).

I can see the issue on Firefox 3.5/Windows too. You'll have to decrease the horizontal padding set on the A elements within the menu so that the difference between font rendering on Mac and Windows is catered for - since you haven't specified a width on the A elements themselves. However, when a user text-zooms your page, the list elements will indeed get shifted down anyway.

[QED Motorsport]

Thank you James, exactly what I was after! Currently in the process of changing all the em's to px in order to avoid any further issues!

[jameshopkins]

Remember, you can't stop a user zooming text so for your layout to remain usable, you need to take into account any overflow that may occur - converting to pixels won't necessarily remove this issue.