Solved

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

Posted on 2012-04-13
8
187 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
Technology Partners: 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 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

Technology Partners: 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!

Question has a verified solution.

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

Suggested Solutions

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…

756 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