4 replies [Last post]
Vik
Offline
Regular
Last seen: 14 years 27 weeks ago
Joined: 2008-01-17
Posts: 12
Points: 0

I have links on the top of my home page. Each link has a background image (a bullet) and the text of the link. The div for the text has a left padding of 30px to keep it from landing on top of the bullet in the background image. This is working perfectly on Mac Firefox and Safari, but is not yet working on IE 6. Oddly, the padding is ignored on the first link, but works properly on the other links.

Here's an illustration:

(Note- the illustration says the anomaly is in IE 6 and 7, but it may be only in IE6 at this point - I've been working on this for a day or so.)

I've replicated the anomaly on two small test pages.

http://www.flavorzoom.com/anomaly.html is fine and looks as expected.

http://www.flavorzoom.com/anomaly_b.html has the image for the left-most link ("Home") missing (in IE6).

The only difference between the two files, is a font-family specification for the body:

font-family: Arial, Helvetica, sans-serif;

How can I fix this?

DanA
DanA's picture
Offline
Elder
Last seen: 12 years 13 weeks ago
Timezone: GMT+2
Joined: 2004-08-14
Posts: 1087
Points: 2

This is a hasLayout

This is a hasLayout issue.
Add display:inline-block; in .selected and in #fz_menuin a
Alternatively, use a list for your navigation.

Vik
Offline
Regular
Last seen: 14 years 27 weeks ago
Joined: 2008-01-17
Posts: 12
Points: 0

That fixed it. Thank you

That fixed it. Thank you very much! Smile

Vik
Offline
Regular
Last seen: 14 years 27 weeks ago
Joined: 2008-01-17
Posts: 12
Points: 0

Update: it fixed it in IE6

Update: it fixed it in IE6 and Mac FireFox, but broke it in Safari 3, as can be seen in the demo link I posted (which I have now updated) -

http://www.flavorzoom.com/anomaly_b.html

Is there a way to address the hasLayout issue that will also work in Safari?

Vik
Offline
Regular
Last seen: 14 years 27 weeks ago
Joined: 2008-01-17
Posts: 12
Points: 0

Fixed! I just had to

Fixed! I just had to remove:

width:1em;

...from #fz_menu.