how would i do the following in css

[john mattucci]

Im developing a drop down unordered menu and Im attempting to keep the parent node selected i.e. have the text remain selected when entering the child nodes. Im wondering if this is possible.

/** Dropdowns **/
#nav, #nav ul {
padding: 0;
margin: 0;
font: 10pt;
list-style: none;
float: left;
width: 213;
background: #F0ECEB;
}

#nav li { /* all list items */
position: relative;
float: left;
width: 213;
}

#nav li ul { /* second-level lists */
position: absolute;
background: #FAFAFA;
font-weight: 500;
left: -1000px;
margin-left: 214;
margin-top: -27px;
}

#nav li ul ul { /* third-and-above-level lists */
left: -1000px;
}

#nav li a {
width: 213;
display: block;
text-decoration: none;
padding: 2px 1px;
margin: 1;
color: #000000;
border-top: 1px solid #A7A7A7;
border-right: 1px solid #A7A7A7;
border-bottom: 1px solid #A7A7A7;
border-left: 1px solid #A7A7A7;

}


/** Mouseover on leaves change to white **/

#nav li a:hover, #nav li:first-child li:hover{
color: #FFFFFF;
background: #8A97B9;
border: 1px solid #A7A7A7;
}


/** Mouse OFF Non-Leaves **/
#nav a.encl {
background: url('encl.gif') no-repeat center right;
}

/** Mouseover Non-Leaves **/
#nav a.encl:hover, #nav li.hover {
background: #8A97B9 url('enclover.gif') no-repeat center right;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul, #nav li.iehover ul ul, #nav li.iehover ul ul ul, #nav li.iehover ul ul ul ul {
left: -1000px;
}

#nav li:hover, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul, #nav li.iehover ul, #nav li li.iehover ul, #nav li li li.iehover ul, #nav li li li li.iehover ul { /* lists nested under hovered list items */
left: auto;
}

[john mattucci]

can someone please tell me if this is even possible with css

[Eric Pascarello]

I will look at it in detail later on today, I think it is possible, I just have to look at what you have done.

Eric

[john mattucci]

did u ever have a chance to look at it