Div z-index issue

1

I have a web page that has an .asp include for the navigation header. On the sides and the top of these, I need a click-able ad. I can’t seem to figure out how to make all this work together. I don’t even know if it’s possible.

Here’s a visual of what I’m trying to achieve:

Here’s what I have for the div that holds the ad in the background:


#ad {
    position:fixed;
    display: block; 
    margin-left:auto;
    margin-right:auto;
    margin-top:-200px;
    width: 800px; 
    height: 450px;
    z-index-1;
    cursor:pointer;
    background:url(myImage.png) no-repeat scroll center top transparent; 
}

The margin-top:-200px is so the ad can go to the top of the page.
The result of this is that only the bottom portion of the ad (just below the header) works in IE, and nothing is click-able in Firefox.

I created an example of this in jsFiddle, but it’s not accurate since I can’t create the include. I guess this can be used for a better visual: http://jsfiddle.net/masada/bdMB2