Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

How can I adjust the z-index in this situation?

Posted on 2012-04-13
8
Medium Priority
?
214 Views
Last Modified: 2012-06-27
I've got scrolling text happening beneath a pulldown menu. When you click on the pulldown, the scrolling text covers it up.

I'm thinking there's a z-index setting that I can deploy, but I've not come across anything that works.

I have a screen shot of my dilemma attached. My code is also attached.
Screen-shot-2012-04-12-at-8.34.2.png
code.txt
0
Comment
Question by:brucegust
  • 5
  • 3
8 Comments
 

Author Comment

by:brucegust
ID: 37844636
stylesheet.cssHere's my spreadsheet...
0
 
LVL 38

Expert Comment

by:Tom Beck
ID: 37846103
It appears to be a problem in older versions of IE, older than IE8. That's around 1% usage among browsers worldwide and most of those users are in developing countries. If I am right, then why even worry about it?
0
 

Author Comment

by:brucegust
ID: 37846119
I guess because my box is using IE8 and I wanted to make sure that if there was someone out there like me, they weren't being denied the opportunity to navigate around my site.

Is it that uncommon?
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:brucegust
ID: 37846122
Thing is, when I go out to http://www.muscularchristianityonline.com/campus, I'm using the same infrastructure, but the problem doesn't exist. So I'm just trying to figure out what I've done in my development environment that's created the dilemma.
0
 
LVL 38

Accepted Solution

by:
Tom Beck earned 2000 total points
ID: 37846198
You don't have a javascript marquee or a sub menu on that link so there's not much comparison.

I would be able to verify this as a solution if you provided a live link, but I think this will fix it without messing up something else.

#nav {
            margin: 0;
            padding: 0px 0px 0;
            width: 400px;
            height:40px;
            position:relative;
            z-index:300

            }
0
 

Author Comment

by:brucegust
ID: 37846220
That did it!

Thanks, Tommy!
0
 

Author Closing Comment

by:brucegust
ID: 37846221
Off the hook!
0
 
LVL 38

Expert Comment

by:Tom Beck
ID: 37846237
Glad it worked (and a little surprised that it did not mess up something else). The z-index number is arbitrary. Just as long as it's the highest z-index number on the page. Older versions of IE don't always recognize z-index unless you have position:relative or absolute.

Thanks for the points.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer…
Why do we like using grid based layouts in website design? Let's look at the live examples of websites and compare them to grid based WordPress themes.
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses

885 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