Heh... dropdown menu over text- z index problem??

liunx

Guest
Hiya again...
sorry to bother so often, but whenever I try to modify the font-family or font-size, it screws up majorly. I finally got SOMETHING to work.. but regardless of how I do it, every time I am scrolling down the drop down menu list, when my cursor is anywhere over the text underneath the dropdown menu, the menu disappears, so I cannot click on the bottom few pieces of the menu. This is kind of aggravating.

To see what I mean, try putting your cursor over "Diamonds" and then scrolling down to "Colored Diamonds."

I tried putting z-index set to a REALLY high value in every single css thing, but even that didn't work. Even though it looks really stupid now :-P, here is the wedding.css code that is being accessed by the page-


<!-- m --><a class="postlink" href="http://www.dragonflydays.net/Website_Work/WeddingShop/Website/index.php">http://www.dragonflydays.net/Website_Wo ... /index.php</a><!-- m -->


<STYLE type=text/css>


DL {
Z-INDEX: 900; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}

DD {
Z-INDEX: 900; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 3px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}


UL {
Z-INDEX: 900; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}
LI {
Z-INDEX: 900; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none; font-size: 9pt; font-family: Verdana, Arial;
}
#menu {
Z-INDEX: 900; LEFT: 54px; WIDTH: 100%; POSITION: absolute; TOP: 133px
}

#menu DL {
Z-INDEX: 900; position:relative; FLOAT: left; MARGIN: 0px 0px; WIDTH: 76px
}

#menu DD {
Z-INDEX: 900; position: absolute; top: 39px; left: 10; width: 10em; white-space: nowrap;
PADDING-BOTTOM: 0px; BORDER-RIGHT: #CA9EAE 1px solid; BORDER-TOP: #CA9EAE 1px solid; BORDER-LEFT: #CA9EAE 1px solid; BORDER-BOTTOM: #CA9EAE 1px solid
}


#menu LI {
Z-INDEX: 900; BACKGROUND: #F6E9F0; TEXT-ALIGN: left
}

#menu LI A {
Z-INDEX: 900; BORDER-RIGHT: white 2px dotted; BORDER-TOP: white 1px solid; DISPLAY: block; BORDER-LEFT: white 2px dotted; COLOR: #656565; BORDER-BOTTOM: white solid 1px; HEIGHT: 100%; TEXT-DECORATION: none
}


#menu LI A:hover {
Z-INDEX: 900; BACKGROUND: #FFFFFF; COLOR: #A1677D
}
A {
Z-INDEX: 900; COLOR: #EADFE7; TEXT-DECORATION: none
}
</STYLE>


Again, thanks so much for the help before! Any suggestions or advice would be very welcome.
-Sarah*It works fine for me on FF, it does flicker a bit thoughIt works fine for me; I'm using Safari.So it's just IE.... Blimey. Is there ANY way to fix this? (Besides starting all over)
-Sarah*
 
Back
Top