Posizionare link sottomenu su unica riga

[lucacompagnone]

Buona giornata a tutti,sono un nuovo utente,ho 18 anni e vengo da rimini,e mi sto avvicinando al mondo della progettazione di siti web,allora vado subito al nocciolo del problema,vorrei sapere da voi esperti,come fare per posizionare i link di un sottomenu su un unica riga?
Di nuovo una buona giornata a tutti voi!!!

[Simo990]

Devi applicare l'attributo inline ai tag del sottomenu... supponendo che sia una lista non ordinata <ul>, dovrai fare:

li {display:inline}

Buona giornata anche a te

[lucacompagnone]

grazie Simo per la risposta,si comunuqe ho fatto una lista non ordinata,posto il codice:

html

<div id="menu"> 
<ul> [*]HOME [*]FILM 
<ul> [*]TRAMA [*]REGISTA [*]CAST [*]EXTRA [*]TRAILER [/list]
 [*]BRANDON LEE 
<ul> [*]BIOGRAFIA [*]FILMOGRAFIA [*]INTERVISTA [*]MISTERO LEE [/list]
 [*]GALLERY 
<ul> [*]FOTO [*]VIDEO [*]MUSICA [/list]
 [*]INFO [/list]
</div>

css

body{ background-color: white; }  
#menu{ 
position: relative; top: 60px; padding: 0; margin: 0;  
}  
#menu ul{ 
margin: auto; padding: 0; 
}   
#menu li{ 
position: relative; float: left; list-style: none; margin: auto; padding:0; 
}  
#menu a{ 
width: 150px; height: 30px; display: block; text-decoration: none; text-align: center; line-height: 30px; background-color: black; color: white; 
}  
#menu ul ul{ 
position: absolute; top: 30px; visibility: hidden; width: 800px; height: 30px; 
}  
#menu ul li:hover ul{ 
visibility:visible; 
}  
#menu ul :hover > a{ 
background-color: #A9A9A9; color: red; 
}

Non ho capito dove inserire "display: inline" , però se aggiungo width: 800px; height: 30px a; #menu ul ul...viene posizionato su una riga,quale modo è migliore?
grazie ancora

[lucacompagnone]

up

[Simo990]

Il modo migliore sarebbe di creare delle classi, visto che il tuo codice è un po' incasinato... metti caso che devi fare una nuova lista non ordinata, quest'ultima erediterà le stesse proprietà che hai definito per il menù!

Metti questo codice in fondo al css:

.list { display:inline }

Poi applica la classe a tutti i sottomenù, in questo modo:

[*]SOTTOMENU

Dovresti ottenere lo stesso risultato e avrai il codice pulito

[lucacompagnone]

grazie scusa Simo ma questo che mi hai detto tu,è molto importante oppure è solo un metodo per avere un codice più chiaro?

Avrei un altra domanda sempre in merito di questo menu,l'ultima e poi ho completato il mio primo menu .

Spero di fare bene a farla qua senza aprire un nuovo topic,

Come devo fare per centrare il div menu,in modo che il menu venga posizionato giusto al centro?

[Simo990]

grazie scusa Simo ma questo che mi hai detto tu,è molto importante oppure è solo un metodo per avere un codice più chiaro?

è solo un metodo per avere un codice più chiaro. visto che anche il tuo metodo funziona come dovrebbe, puoi lasciarlo così

Come devo fare per centrare il div menu,in modo che il menu venga posizionato giusto al centro?

devi impostare i margini left e right a "auto".
così:

div { margin: 0 auto }

Oppure (soluzione migliore, almenoché tu non voglia centrare TUTTI i div), dai un ID al div menu e gli applichi la stessa proprietà:

div #menu { margin: 0 auto }

di conseguenza nell'html dovrai dichiarare:

<div id="menu"> ...contenuto del menu... </div>

Se hai altri dubbi fammi sapere

[lucacompagnone]

grazie per la disponibilità, io nel codice html gia l'avevo impostato <div id="menu"> ho provato ad aggiungere div #menu { margin: 0 auto } ma non va...

[Simo990]

Non va perché non ha una dimensione fissa...

prova ad aggiungere

#menu{ 
position: relative; top: 60px; padding: 0; margin: 0 auto; width:600px; height: 50px;   
}

così dovrebbe funzionare
poi ovviamente puoi dargli la dimensione che vuoi

[lucacompagnone]

grazie per il menu funziona ... Ora se vorrei fare una cosa del genere con il sottomenu,devo creare un <div id="sottomenu"> ??