Solved

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

Posted on 2012-04-13
8
183 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
Free Tool: Postgres Monitoring System

A PHP and Perl based system to collect and display usage statistics from PostgreSQL databases.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 

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 500 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

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

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 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 different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

809 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