Problema menu css a cascata

[Sergej_D]

Salve, per il mio sito sto realizzando un menu css a comparsa seguendo questa guida: http://css.flepstudio.org/css-tutori...e-di-base.html

Ho però un problema: se provo a dare una dimensione maggiore alla seconda lista, quella che "appare", gli elementi del menu della sottolista non sono messi uno sotto l'altro, ma accanto, fino a riempire lo spazio orizzontale.
Qui vedete la bozza su cui sto lavorando, si capisce bene: http://www.ildeposito.org/bozza/

Io ovviamente vorrei che gli elementi del sotto menu siano uno sotto l'altro..

Mi potete dare una mano?

Ecco il css che sto usando:

#menu{
padding:0;
margin:0;
}

#menu ul{
padding:0;
margin:0;
}

#menu li{
position: relative;
text-align: left;
float: left;
list-style: none;
margin: 0;
padding:3px;
}

#menu li a{
height: 20px;
display: block;
text-decoration:none;
color: #414141;
margin-right: 10px;
margin-left: 3px;
font-weight: bold;
font-size: 12px;
}

#menu li a:hover{
color: #A20000;
}

#menu ul ul{
position: absolute;
top: 20px;
visibility: hidden;
background-color: #ffffff;
border: 1px solid #bbbbbb;
width: 150px;
}

#menu ul ul li a {
	font-weight: normal;
	font-size: 11px;
	height: 12px;
	margin: 0px;
}

#menu ul li:hover ul{
visibility:visible;
}

Grazie a tutti

[uffissimo]

ho dato solo un rapido sguardo...
vista l'ora

cmq il problema dovrebbe essere il float:left, ma se lo togli non avrai più un menù orizzontale, prova ad aumentare anche la larghezza dei tag aall'interno della sottocategoria:

#menu ul ul li a {
font-weight: normal;
font-size: 11px;
height: 12px;
margin: 0px;
width: 150px;
}

dovrebbe funzionare ;P

[Sergej_D]

Sì, questa soluzione funziona però mi obbliga ad avere le "sub-liste" a grandezza fissa, a prescindere dal test che metto come voci.
Ci sono altre soluzioni?

Oh, una soluzione è mettere un
alla fine di ogni voce del menu..

[uffissimo]

io ti consiglio la larghezza fissa... o a limite puoi provare a fare così:

#menu ul ul li a {
font-weight: normal;
font-size: 11px;
height: 12px;
margin: 0px;
float:none;
}

non so se funge... prova... ;P

[Sergej_D]

Allora, funziona se il float: none; lo metto all'elemento "li", non a "li a".
Il problema, però, è che non mettendo larghezza, la larghezza della "sottolista" è uguale alla larghezza dell'elemento-padre..

[Sergej_D]

Forse mi conviene dare alla sotto-lista una larghezza "fissa", corrispondente alla lunghezza della voce più lunga..

[uffissimo]

beh sì secondo me conviene...
è un progetto dinamico???pensi che in futuro cambieranno spesso le voci di menu?
se non è così... conviene fare come hai detto

[Sergej_D]

No, le voci del menu sono tendenzialmente fisse