CSS Flyout Menu/Flash Problem

[bgroup99]

Hi,

My website is www.vapenow.com. I have the css flyout menu installed in the upper right sidebox. I recently put in a flash slideshow on my main page.

The problem is that when the css menu flies out, it is behind the flash player (just scroll over one of the categories with the arrow to see). Is there anyway to get it so the categories fly out in front of the flash player?

Thanks,

Nate

[kobra]

This is a z-index solution....but not sure what is defined for the flash or to what div you have it inserted into?

[bgroup99]

This is a z-index solution....but not sure what is defined for the flash or to what div you have it inserted into?

I don't even know what the z-index is. The src for the flash is in the define_main_page if that is a relevant piece of info.

Thanks for your help.

[kobra]

Read this and apply to your elements to correct:
http://www.w3schools.com/css/pr_pos_z-index.asp

[bgroup99]

Read this and apply to your elements to correct:
http://www.w3schools.com/css/pr_pos_z-index.asp

Thanks for the link. I checked it out and tried to change the z-index on my elements.

I defined a class called .flash {position:relative; z-index:-1}. That did not work.

I then edited my stylesheet_categories_menu.css file and defined

div#nav-cat ul ul {
position: absolute;
top: 0;
left: 50px;
width: 110px;
display: none;
z-index: 10;
}

That didn't work. I messed around with the menu stylesheet until I got the menu to be at leats navigable (www.vapenow.com) with the flash slideshow. But I am wondering what I am doing wrong? Do I need to add z-index values to elements already defined in stylesheet.css?

Thanks for your ongoing help!

Nate

[kobra]

The src for the flash is in the define_main_page

Is this entered in this file sorta like:

<div class="flash">
  If you cannot see the Flash content, you may need to update your Flash Player.
</div>

<script type="text/javascript">
   var so = new SWFObject("images/Your_flash.swf", "movie", "???", "???", "6", "#000000");
   so.write("flash");
</script>

Where you have defined this flash as being this div? If so then in the css:

.flash {
        position: relative;
        z-index: -1;
        }

Then just try making the others z-index: 1000;