Member Avatar for hindu times

Hi there,

I'm currently building a storefront for the following site: www.rjthompsonmusic.com/store/store2

I'm having a little trouble with the z-index of the dropdown menu (when you hover over HOME of MUSIC in the store).

I've set the z-index of the menu to 1000 which works fine in IE8, Safari, FF, and Chrome, but it still displays behind part of the images below in IE7 and earlier, and Opera.

Any help would be awesome.

(ps. you need to close the blue instructions box before you'll be able to see what I mean)

Many thanks.

Edited by pritaeas because: Removed link.
  • 3 Contributors
  • 4 Replies
  • 222 Views
  • 14 Hours Discussion Span
  • Latest Post Latest Post by Arkinder
Member Avatar for Arkinder

I don't see what you're talking about in Opera, and I don't have IE. I'll look at this more later when I have access to a PC. Could you possibly post a screen shot of the problem?

Regards, Arkinder

Member Avatar for hindu times

Sure, no problem. Fixed it in Opera, but still have a problem in IE7 and earlier:

www.rjthompsonmusic.com/img/store_img/menu_z_index_error.jpg

Edited by pritaeas because: Removed link
Member Avatar for Kraai

I can see what you mean in IE 7. I'm just guessing here, but it seems that it is only the description area on top of the pictures below the drop down menu that are obscuring the menu list, and not the pictures themself?

If so, it may help to re-position those descriptions maybe to the bottom part of the pictures.

Member Avatar for Arkinder

Start with fixing all of your CSS errors. Copy and paste the CSS here. You will see that at the bottom of the page a valid form of your code is spit out. You have 30 HTML errors too, but none of them are affecting the page.

In IE6 something is overextending the li and/or the a - causing the ddcontainer to go down into your images. I think it may be from a lot of your comments not being ended in your CSS.

Since the boxes over the images are positioned relatively and the ddcontainer is positioned absolutely, they are both removed from the normal flow of the page, and will be listed from the bottom up in the order they are written. Putting your navigation after the images/boxes in your HTML is a possible fix. However, it will require reposition the navigation back to it's original place.

Or as Kraai said, you could simply move the boxes elsewhere. Regardless, there would still be an inconsistant "height" issue.

Regards, Arkinder

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.