Previous Message
Next Message

SOS submenus not staying displayed

Sent by Iorhael on 18 March 2006 03:03


This is for all the SOS experts out there...I have set up a cascading menu using SOS but can't get
the submenus to stay displayed upon hover. I have included the csshover2.htc file. I have a feeling
that it is some small thing in the code that I am forgetting ;(

Thanks!
Debbie

Link:

http://www.drkdesign.com/voicebox_demo/


Menu CSS:

/* CSS Popout Menu */

/* Fix IE. Hide from IE Mac \*/
* html #menu ul li{float:left;height:1%;}
* html #menu ul li a{height:1%;}
/* End */


#menu { 
   position: absolute;
   top: 115px;
   left: 0px;
   width: 130px;
   z-index: 10;
}  

#menu a, #menu a:visited {
   display: block;   
   text-decoration: none;
   padding: 6px 0 6px 18px;
   width: 105px;
   font: 85% Verdana, Arial, Helvetica, sans-serif;
   font-weight: bold;
   font-style: italic;
   color: #EEA669; /*orange*/
   text-align: left;
   white-space: nowrap;
}

#menu a.parent:hover /* attaches parent-arrow on all parents */
 {
 background-image: url(../images/vb_arrow.gif);
 background-position: right;
 background-repeat: no-repeat;
 }

#menu a:hover {
   color: #7BB5E1; /*light blue*/
}

#menu li {
 list-style-type: none; /* removes bullets */
}

#menu ul li {
 position: relative;
}

#menu li ul {
 position: absolute;
 top: 0;
 left: 130px; /* distance from of left menus (should be same as width) */
 font-size: 80%;
 display: none;

}

#menu li ul li {
 width: 130px;
 background-color: #362CA3;
 border-top: .5px solid #F4BA89; /*light orange*/
 border-top: .5px solid #F4BA89; /*light orange*/
 border-bottom: 1px solid #828282; /*dark gray*/
 border-right: 1x solid #828282; /*dark gray*/
 padding: 3px 10px 3px 0px;
}

 
 
/*IE fixes*/
 
div#menu ul, #menu ul ul, div#menu ul ul ul {
 margin:0;   /* keeps the menu parts together */
 padding:0;
 width: 100px;   /* width of sub menus */
}

div#menu ul ul, div#menu ul ul ul, div#menu ul li:hover ul ul, div#menu ul li:hover ul ul ul {
 display: none;
}

div#menu ul li:hover ul, div#menu ul ul li:hover ul, div#menu ul ul ul li:hover ul {
 display: block;
}
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread: