Newsgroup: it.comp.www.html
Titolo: [css] allineamento verticale in un DIV

Salve a tutti,
so che é un post già discusso...ma non riesco a risolvere il problema.
Ho cercato molto anche sui siti più rinomati (ALA, w3cschools, constile,
etc..) ma niente da fare.
Ho un layer con una immagine soltanto e voglio che questa venga centrata
rispetto al layer, sia in altezza che in larghezza.
<div><img src="img.jpg" width="60" height="60" border="0"></div>
div
    {
        width:120px;
        height:120px;
        text-align:center;
    }
img
     {
         margin:0 auto;
        display:block;
        vertical-align: middle;
      }
(naturalmente qui ho riportato lo stretto necessario)
ho provato..ma invano anche a mettere "vertical-align: middle;" nella classe
div...ma niente.
Poi ho letto che l'immagine é un elemento inline allora ho aggiunto
"font-size: 60px;" in div... così in IE sembrava funzionare...anche se non
mi sembrava molto bello a farsi...però su Mozilla non ne voleva sapere.
Quindi mi rivolgo a voi... che correzioni posso usare per ottenere quello
che voglio? Credo ci sia qualche concetto che non riesco a chiarirmi.
Grazie in anticipo a tutti
    Mark

Che strano.. un deja vu... :)
-- 
:: Massimiliano Mattei
:: Project Leader
:: EVA Group :: 
www.evagroup.net
:: Soluzioni extranet :: e-business :: corporate portal

Chiedo umilmente scusa...ma alla fine mi sono accorto che é il mio server di
news che non funzionava e non il programma di news che pensavo non mandasse
il post.
Mark...che ce l'ha a morte con chi vende i servizi che non funzionano come
dovrebbero!!

 rispetto al layer, sia in altezza che in larghezza.
[...cut...]
Tieni conto che l' immagine si può centrare facilmente come sfondo...
ma se in effetti quest' immagine ha contenuto visuale effettivo, dovrebbe
essere parte del codice html.
Se dimensioni del div e dell' immagine sono noti, niente di più facile:
<div style="width:120px;height:120px;text-align:center;border:1px solid #ccc">
    <img src="img.jpg" style="width:60px;height: 60px;margin-top:30px" alt="non dimenticare l' alt text">
</div>
come vedi per l' allineamento verticale è bastato aggiungere un margin-top all' immagine.
Se le dimensioni del contenitore non sono note, ma del contenuto si, la tecnica da usare
è questa:
http://www.wpdfd.com/editorial/wpd0103.htm#toptip
Se non sono note le dimensioni (e in particolare l' altezza) del contenuto,
la centratura verticale è impossibile.
vertical-align cmq non serve a questo scopo, cerca con google gruppi tra i vecchi post.
Ciao,
    Alessandro Fulciniti

 Ciao,    Alessandro Fulciniti
Grazie Alessandro, sempre molto gentile!

Prova usando le cornici come sfondo del div che contiene l'immagine, dando
un padding di di n pixel al div.
Un esempio anche se un pò complesso lo trovi qui: 
www.evagroup.net
 nel SITO
DEMO
Osserva le ombre delle immagini. Se vai sulla ricerca dei prodotti in
particolare, vedrai che le dimensioni sono tutte differenti ma l'ombra è
sempre corretta.


 rispetto al layer, sia in altezza che in larghezza.
Se devi posizionare centralmente un qualcosa, nessun problema: decidi
l'altezza del DIV non con HEIGHT ma con LINE-HEIGHT
In questo modo, automaticamente, testo e oggetti verranno collocati
centralmente (dal punto di vista dell'allineamento verticale).

 la centratura verticale è impossibile.
C'è in realtà un sistema: uno smacco per noi che odiamo utilizzare le
tabelle per formattare: l'immagine va inserita in una cella di tabella.
Purtroppo non ci sono alternative!

 Purtroppo non ci sono alternative!
Zefiro hai detto bene... "purtroppo". Sono così abituato a non pensare alle
tabelle che lo stavo dimenticando...Aggiungo che in tal caso il vertical-align
applicato a una cella assume il ruolo del vecchio attributo "valign" e quindi
fa una perfetta centratura verticale.
Pensavo una cosa.. dato che le immagini vengono reperite da php come diceva
Mark, in questo caso si potrebbero reperire le dimensioni con php e creare degli
stili in linea(vedi margin-top) al volo. Non è delle migliori soluzioni, ma si può tentare
se proprio non si voglio usare le tabelle.
Saluti,
    Alessandro Fulciniti

 se proprio non si voglio usare le tabelle.
Osservazione giustissima, purtroppo però non mi hanno installato le giuste
librerie sul server... ce n'é di strada da fare...
Grazie a tutti comunque, ho imparato qualcosa da dire al grafico quando mi
chiede se una cosa si può fare! :))

 centralmente (dal punto di vista dell'allineamento verticale).
Grazie mille, lo provo subito!
Mark

 librerie sul server... ce n'é di strada da fare...
Un server che non monta le GD2 a mio avviso è poco credibile. Mi chiedo che
versione di php ha!
Considero le GD2 parte integrante di php. 
Cambia provider.
Ho avuto un problema analogo. Pensa che con uno script sono riuscito ad
andare alla collonna affianco calcolando l'altezza delle immagini generate.
Arjuna
-- 
Homo sum, humani nihil a me alienum puto.
 09/04/2004 12.21.36