Hola a todos, espero me solucionen el problema..
Tengo un menu css en el cual una rayita vertical (pipe) separa los items los cuales no tienen fondo y solo se ponen en negrita cuando esta "hover". El problema es que deseo que la rayita solo aparezca entre los items del menu, mas no en los items de los submenus que es como está. Les adjunto el código CSS como sigue:
* {
padding: 0px;
margin: 0px;
}
#menu {
margin: auto;
width: 693;
font-family:Arial, Helvetica, sans-serif;
font-size: 14px;
}
ul, ol {
list-style: none;
}
.nav ul > li {
background-color: #b00c11;
color: #FFF;
}
.nav ul {
color: #FFF;
}
.nav li a{
color: #000;
text-decoration: none;
padding: 10px 10px;
display: block;
}
#menu li + li a:before {/*ESTE ES EL CARACTER SEPARADOR*/
content: "|";
padding-right: 15px;
}
/*.nav li ul li a {
content: "";
padding-right: 15px;
} */
/*temporal*/
.nav ul li a:hover {
background-color: #FF0909;
color: #FFF;
font-size: 12px;
}
.nav ul li a {
/*background-color: #CCC */
color: #FFF;
font-size: 12px;
}
/*fin temporal*/
.nav > li {
float: left;
}
.nav li ul {
display:none;
position: absolute;
min-width: 140px;
z-index: 1000;
}
.nav li:hover > ul {
display: block;
}
.nav li ul li {
position: relative;
}
.nav li ul li ul{
right: -140px;
top: 0px;
}
Agradeceré a quien me pueda ayudar. Saludos