Solved

IE7 not displaying fly-out menus correctly, z-index issue?

Posted on 2011-02-28
3
207 Views
Last Modified: 2012-08-13
My page:

http://www.dbiservices.com/new/deangelobrothersinc

Works great in all browsers, including IE8. Client tells me users with IE7 are showing a problem. Screenshot is attached. I have z-index set already (I think). Any idea what this could be? Thank you!
default.png
0
Comment
Question by:bbdesign
  • 2
3 Comments
 
LVL 14

Accepted Solution

by:
R-Byter earned 500 total points
Comment Utility
Here you go. Replace this classes in you css part:

SPAN.mainlinksfly A {
	PADDING-BOTTOM: 4px; BACKGROUND-COLOR: #e7eeda; PADDING-LEFT: 8px; PADDING-RIGHT: 0px; DISPLAY: block; PADDING-TOP: 4px; Z-INDEX: 1000; POSITION: relative;
}
SPAN.mainlinksfly A:hover {
	BACKGROUND-COLOR: #d5e2c0; Z-INDEX: 1000; POSITION: relative;
}
div.bodyleft, div.ph_home3 {
	z-index: -1000;
}

Open in new window


Basically you need to set z-index and position to span.mainlinksfly a element and also put lower z-index number and of course position on elements which will be overlaid.

Regards
0
 

Author Comment

by:bbdesign
Comment Utility
Fixed. Thank you!
0
 
LVL 14

Expert Comment

by:R-Byter
Comment Utility
You're welcome and thanks for the points.
0

Featured Post

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight! There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

15 Experts available now in Live!

Get 1:1 Help Now