Tengo un problema al generar micss, y no tengo idea, o por lo menos, no doy en el clavo. Quisiera que mi <li class="selected">
tenga el background color "rojo" pero no se puede.
Dejo mi código:
<html>
<head>
<title>Prueba de navbar</title>
</head>
<body>
<div class="desktop_menu" id="desktop_menu">
<div id="sidebar">
<ul class="categories">
<li><a href="#" class="selected">inicio</a></li>
<li><a href="#">envíos locales</a></li>
<li><a href="#">solicitar envios (nac - int)</a></li>
<li><a href="#">contacto</a></li>
<li><a href="#">blog</a></li>
<li><a href="#">pagos</a></li>
<li class="selected"><a href="#">clientes e-commerce</a></li>
</ul>
</div>
</div>
</body>
</html>
<style>
.categories {
list-style:none;
color:#666;
background:#f7f7f7;
}
.categories li {
font-size:14px;
color:#666;
background:#f7f7f7;
height:39px;
border-bottom:1px solid #e9e9e9;
}
.categories li:first-child {border-top:none;}
.categories li a {
display:block;
height:39px;
line-height:39px;
padding:0 8px;
text-decoration:none;
color:#666;
background:#f7f7f7;
}
.categories li a:hover, .categories li a.selected {
font-weight:bold;
}
.selected li {
background: red;
}
</style>
selected li
debería serli.selected
, indicando "cuando un elementoli
tenga la clase selected...".a.selected