Tengo un problema a la hora de hacer una lista para un menu. Se trata de un lista con sublistas es decir, he creado la clase #navcontainer ul, #navcontainer ul ul y #navcontainer ul ul ul de la siguiente forma en el css:
#navcontainer ul
{
margin-left: 0px;
padding-left: 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-align:left;
font-size: 10px;
font-weight: bold;
list-style-position: inside;
list-style-image: url(cuadratin.gif);
}
#navcontainer ul ul
{
padding-bottom: 10px;
list-style-position: inside;
list-style-image: none;
}
#navcontainer ul ul ul
{
padding-bottom: 10px;
list-style-position: inside;
list-style-type: none;
}
Todo eso es para este html:
<div id="navcontainer">
<ul id="navlist">
<li><br /><p>Ventas</p>
<ul>
<li>Costa Mediterránea
<ul>
<li>Nuevas promociones </li>
<li>Apartamentos y pisos</li>
</ul>
</li>
<li>Comunidad de Madrid
<ul>
<li>Nuevas promociones</li>
<li>Apartamentos y pisos</li>
</ul>
</li>
</ul>
</li>
<li><p>Alquileres</p>
<ul>
<li>Costa Mediterránea
<ul>
<li>Nuevas promociones</li>
<li>Apartamentos y pisos</li>
<li>Chalets</li>
</ul>
</li>
<li>Comunidad de Madrid
<ul>
<li>Nuevas promociones</li>
<li>Apartamentos y pisos</li>
</ul>
</li>
</ul>
</li>
<li><p>Grupo Farro</p>
<ul>
<li>Quienes somos </li>
<li>Dónde estamos</li>
<li>Contacto</li>
</ul>
</li>
<li><p>Enlaces de Interés</p></li>
<ul>
<li>Admira Comunicación</li>
</ul>
<li>
<p>Revista Farro</p>
</li>
<ul>
<li>Descargar Revista</li>
</ul>
</ul>
</div>
Lo que quiero conseguir es una lista con cuadratines distintos en cada nivel de ul creados con imagenes gif, pero parece que se 'heredan' esos cuadratines, y salen todos iguales.
¿Como se podria hacer una lista con listas dentro y que los cradratines interiores sean distintos segun el nivel?
