Da block ad inline

[thirdeyeblind82]

Ciao a tutti!
Nel mio sito ho creato un menù con 4 pulsanti che dovrebbero trovarsi tutti sulla stessa riga. Purtroppo però, impostando "display:inline" tali elementi perdono le qualità di width, height e background.
Come posso fare?

Sotto per illustrarvi meglio vi posto il css e l'html:

CSS

#header li a{
width:100px;
height:39px;
background-image:{url:immagine.jpg}
display:block;
}


HTML

<ul class="bottons">
[*]
[*]
[*]
[*] [/list]


Grazie mille!

[gengix]

Prova dargli la proprietà float:left.

[thirdeyeblind82]

Grandissimo! Hai risolto con una sola riga!
Se dopo il secondo pulsante voglio tornare a capo come mi consigli di fare?

[gengix]

al pulsante in questione proverei a darei un clear:right.

[thirdeyeblind82]

Originariamente inviato da gengix
al pulsante in questione proverei a darei un clear:right.

Purtroppo no. Va alla riga sottostante ma il valore della "x" non cambia.
Dovrebbe andare sotto al primo pulsante...

[gengix]

Mi puoi postare il codice?

[thirdeyeblind82]

Originariamente inviato da gengix
Mi puoi postare il codice?

Guarda, il codice è lo stesso di sopra, solo che ho aggiunto la riga "float:left" come mi hai suggerito.
Ho provato ad inserire solo per il terzo pulsante la riga "clear:right" ma l'effetto che da è di andare alla riga sottostante ma alla stessa "x".

[gengix]

Scusami se ti rispondo solo adesso ma sono stato lontano dal computer per una settimana.
Se all' ul definisci una larghezza, ad esempio 300px e ai rispettivi li definisci una larghezza di 150px, vedrai che i primi 2 li staranno affiancati, il terzo e il quarto andranno a capo, restando a loro volta adiacenti.
Puoi ottenere così il risultato che desideri.