Z-index problems


I used a script for a slideshow on my page. But it covers my subnavigation.
I know it’s a problem with the z-index, but don’t know how to solve this. I also have a problem with the slideshow. The regular text is set to #222, but when active it doesn’t become #ffffff

Some advice please… Thanks!

Website link

Try this for the dropdown problem:

#headerstretch {
  border-bottom: 3px solid #000000;
  [COLOR="Red"]position: relative;
  z-index: 10;[/COLOR]

As for the white text, an answer would be to add this:

div#feature_list .current h3 {
    color: #fff;

BUT, there’s a major problem. You can’t have h3s (which are block level) inside <a>s, which are inline element. so your code is badly invalid.

Those links shouldn’t have H3s in them anyhow. Just remove those H3 tags and move the H3 styles to the <a>s instead.

Have a look at

Overlapping And ZIndex - CSS Discuss

the stacking context might be the issue.

No sure I am understanding what you mean “slideshow” or “regular text”.

Hi ralph.m,

I’m using Wordpress to generate the slideshow. This is my code in my .php file:

	<a href="javascript:;">
		<h3><?php echo $mypage->post_title; ?></h3>

Can I change it to this?

	<h3><a href="javascript:;"><?php echo $mypage->post_title; ?></a></h3>

Yes, that would be the way to make it fit into your template. WP has the , somewhat irksome habit, of being list-happy.

Yes indeed. But personally, I’d say get rid of the H3s altogether. They don’t belong there, and you can just style the <a>s to look the same. Anyhow, either way, you’ll need to adjust the CSS a bit to reflect the change.

Oh okay ralph.m, didn’t get it like that. Thanks for the help!!