[CSS] Immagine allineata col testo

Ciao a tutti, ho un problema.. (e quando mai! XD)... comunque, volevo fare questa cosa:

(*) testo testo testo testo

Mettendo nel css:

#div { text-align: center; }
#div img { float: left; width: auto; } 

Solo che il testo viene centrato, ma l'immagine si sposta tutta a sinistra! xDDD
Come faccio a mettere l'immagine accanto al testo?...ma il testo deve essere allineato con il centro dell'altezza dell'immagine! XD

(*) = immagine con collegamento 45x31px

Grazie mille. Ciao Davide! ^^"

AL testo dai il padding-left o padding-right della larghezza immagine più qualche pixel e hai finito.

Un esempio? Nel mio sito il menù, ha delle icone.

Allo span ho dato padding-left: 16px; dato che l'immagine è di 14 pixel, solo che io l'immagine l'ho data dome sfondo

Si anche mettendo il padding-left l'immagine si avvicina, ma il testo si allontana! La spaziatura tra testo e img non diminuisce! XDDD

Allora spiegati meglio.

Se fai <img src="" /> <span></span> l'immagine e il testo non sono messi bene scusa?

<div id="div"><a href="#"><img src="#url_img#" alt="" /></a> Il testo deve andare qui...</div> 

Ecco lo schema che uso!

Scusami eh, è ovvio che ti va a sinistra l'immagine se dai float left

Io non ho ancora capito cosa ti serve.

Devo mettere l'immagine come la "posizione ok"... invece a me viene come la "posizione ko"! XD

Ciauu e Grazie! ^^"

[acsocmel]

metti line-height del div uguale a height dell'immagine
oppure height dell'immagine uguale a line-height del div
:-)

Potresti usare anzichè float al div il parametro Align dell'immagine.
Nel mio sito ho fatto esattamente così per la gif accanto le voci dei menù, è il risultato è quello che vedi.
Se a causa delle dimensione dell'immagine hai problemi con la riga sotto, aggiungi al tag br che usi per andare a capo la dichiarazione Clear="left" è il gioco è fatto.

Esempio di codice tratto dal mio sito:

<a href="http://morgensterngdr.altervista.org/news.php"><img src="./Immagini/iconews.gif" alt="Ci Sono News!" align="left" border="0" height="19" width="32">&nbsp;News</a><br clear="left">
   <a href="http://morgensterngdr.altervista.org/email.php"><img src="./orb.gif" alt="" align="left" border="0" height="12" width="12">&nbsp;Contattami</a><br>
<a href="http://morgensterngdr.altervista.org/forum/index.php"><img src="./orb.gif" alt="" align="left" border="0" height="12" width="12">&nbsp;Forum</a>

In questo caso ho messo la dichiarazione direttamente all'immagine, nel momento in cui la inserisco, ma se la metti nel Css funziona comunque.

Per dare lo spazio puoi usare un Div con la carateristica Padding, o se ti è sufficente un Pixel basta uno schifoso ma funzionale &nbsp;

Si.....allora addio xHTML e CSS 2.1! Hihihi

Si.....allora addio xHTML e CSS 2.1! Hihihi

Guarda che line-height è sempre stato valido...

Io parlo per il codice che ha postato @morgensterngdr

Si.....allora addio xHTML e CSS 2.1! Hihihi

Con xHTML non credo sia valido, ma con CSS 2.1 assolutamente si, già testato con il validetor è mi ha detto assolutamente ok. Stessa cosa per HTML, ma non so per xHTML.

Comunque non avevo notato lo / a fine del tag img, e quindi non avevo capito che era xHTML.