Hola amigos,
es primera vez que participo en el foro.
Mi duda es como hago que un menu desplegable no me aparesca en forma de escalones,
yo lo quiero en forma horizontal.
Actualmente lo tengo horizontal, pero con escalones.
Gracias.

CODIGO HTML:

<nav id="menu">
<h2>Aqui encontrara todo lo relacionado a tecnologia </h2>
<ul>
<li><a href="Computadoras Portátiles"</a>Computadoras Portátiles</li>
<li><a href="Computadoras de Escritorio"</a>Computadoras de Escritorio
<ul>
<li><a href="Accesorios"</a>Accesorios</li>
<li><a href="Muebles"</a>Muebles</li>
<li><a href="Entretenimiento"</a>Entretenimiento</li>
</ul>
</li>
<li><a href="Celulares"</a>Celulares</li>
<li><a href="Cámaras fotográficas"</a>Cámaras fotográficas</li>
<li><a href="Impresoras"<7a>Impresoras</li>
<li><a href="Fotocopiadoras"</a>Fotocopiadoras</li>
</ul>
</nav>


CODIGO CSS:

#menu ul {
list-style:none;
margin:0;
padding:0;
}

/* items del menu */

#menu ul li {
background-color:#2e518b;
}

/* enlaces del menu */

#menu ul a {
display:block;
color:#fff;
text-decoration:none;
font-weight:400;
font-size:15px;
padding:10px;
font-family:"HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
text-transform:uppercase;
letter-spacing:1px;
}

/* items del menu */

#menu ul li {
position:relative;
float:left;
margin:0;
padding:0;
}

/* efecto al pasar el ratón por los items del menu */

#menu ul li:hover {
background:#5b78a7;
}/* menu desplegable */

#menu ul ul {
display:none;
position:absolute;
top:100%;
left:0;
background:#eee;
padding:0;
}

/* items del menu desplegable */

#menu ul ul li {
float:none;
width:160px
}

/* enlaces de los items del menu desplegable */

#menu ul ul a {
line-height:120%;
padding:10px 15px;
}

/* items del menu desplegable al pasar el ratón */

#menu ul li:hover > ul {
display:block;