Prima volta coi CSS: realizzare semplice barra menu: mi aiutate??

[Skeet]

ciao a tutti!

sto rifacendo il sito musicale di un gruppo di amici, passando dal vecchio layout a tabelle ai CSS, quindi è la mia prima volta coi CSS.
il sito è molto semplice, ho scelto quindi un layout monolitico, a una colonna, con un header in alto, una barra di navigazione [div#navigation], un div contenuto e un footer.
il mio problema riguarda la barra di navigazione:
nel layout a tabelle ogni link (HOME, BAND, TESTI, etc..) era un'immagine, ora coi CSS ho ricreato i link con una lista non-ordinata, e ho così organizzato il CSS:

#navigation ul {background-color: #6f256c; list-style-type: none; }
#navigation li {display: inline; } 

poi ho centrato il testo della lista andando a indicare un valore ben preciso di height, 25px, e indicando lo stesso valori per line-height così come ho letto dalle guide HTML.
ma a priori come si fa a sapere l'altezza ottimale di un div contenente una riga di testo? spero di essermi spiegato.. il valore 25px io l'ho scelto, perchè nel layout a tabella quella barra aveva un'altezza di 25px, ma coi CSS come si dovrebbe fare? si calcola in funzione della grandezza che si dà ai font?

il risultato è questo (dove si vedono solo l'header e la barra di navigazione):



ora vorrei capire: come faccio a distanziare i vari link in modo tale che ricoprano la lunghezza totale della barra di navigazione?
il risultato che vorrei ottenere è quanto più simile al risultato ottenuto con la vecchia impaginazione a tabelle.
ecco come si presenta attualmente il sito con le tabelle:



poi vorrei capire anche, ma i link devono essere in courier new e di colore bianco: questi attributi vanno assegnati al div#navigation in cui è contenuta la lista, oppure vanno deifniti direttamente al selettore #navigation a relativo all'aspetto dei link?
io nel mio CSS ho scelto la seconda strada, è giusto così?

ringrazio tutti quelli che mi risponderanno e scusate se trovate molte domande banali e/o stupide..

[ricman]

Originariamente inviato da Skeet
ora vorrei capire: come faccio a distanziare i vari link in modo tale che ricoprano la lunghezza totale della barra di navigazione?

Assegni una width (e magari un display:block) ai tag A. Ti basta sapere quanto è la larghezza totale e dividerla per il numero dei link.

Originariamente inviato da Skeet
i link devono essere in courier new e di colore bianco: questi attributi vanno assegnati al div#navigation in cui è contenuta la lista, oppure vanno deifniti direttamente al selettore #navigation a relativo all'aspetto dei link?
io nel mio CSS ho scelto la seconda strada, è giusto così?

Giusto...

[Skeet]

ma assegnando un display block ai tag a finisce che mi si dispongono uno dopo l'altro su righe differenti, invece che essere sulla stessa linea.. forse volevi dire display:inline?

e se invece al posto della barra del menu vorrei mettere un'UNICA immagine con i vari nomi (home, band, testi.. etc) così da avere le scritte con le ombre, come faccio poi a farsì che per ogni nome (Home, band.. ect) corrisponda un link, senza spezzettare i vari pulsanti e posizionarli uno di fianco all'altro coi posizionamenti assoluti?

[ricman]

Originariamente inviato da Skeet
ma assegnando un display block ai tag a finisce che mi si dispongono uno dopo l'altro su righe differenti, invece che essere sulla stessa linea.. forse volevi dire display:inline?

Mi sa di si... infatti io uso il float:left sugli LI

Originariamente inviato da Skeet
e se invece al posto della barra del menu vorrei mettere un'UNICA immagine con i vari nomi (home, band, testi.. etc) così da avere le scritte con le ombre, come faccio poi a farsì che per ogni nome (Home, band.. ect) corrisponda un link, senza spezzettare i vari pulsanti e posizionarli uno di fianco all'altro coi posizionamenti assoluti?

Prendi questo, ad esempio, come spunto...

[Skeet]

ti ringrazio del link.. ora vado a vedere!