Allineamento verticale img dentro div

[ZioAlfredo]

Buongiorno,
ho delle immagini di altezze diverse e non mi è possibile a priori conoscere le altezze.

Queste immagini dovrebbero per questioni estetiche apparire allineate al centro di un DIV, ma non riesco a farlo ne conosco il comando CSS. Pensavo fosse vertical-align middle ma non funziona.

Qualcuno sa come fare?
Grazie

[KillerWorm]

Ciao, allineare centralmente in verticale col CSS era una cosa non troppo semplice fino a qualche tempo fa.

Qui una vecchia citazione (liberamente tradotta):

Il modo più semplice per centrare verticalmente qualcosa in CSS è chiudere il tuo laptop e andare al bar.

(fonte: https://twitter.com/thedaniel/status/414123893830336513)

Fortunatamente ora esiste Flexbox che risolve varie problematiche del genere.
In linea di massima puoi applicare queste regole per il DIV contenitore:

display: flex;
align-items: center;
justify-content: center;

Qui una vecchia discussione dove puoi trovare altre indicazioni sull'argomento:
https://forum.html.it/forum/showthre...readid=2965493

E' chiaro che a seconda del contesto potrebbe essere necessario adeguare il codice. Se incontri difficoltà sarebbe utile postare anche il tuo attuale codice (HTML e CSS) relativo alla questione, così che eventualmente ti si possa aiutare in maniera più puntuale.

[ZioAlfredo]

Grazie KillerWorm,
per la risposta.

Ti informo che il codice funziona (inserito nel div padre), ma ho dovuto indicare obbligatoriamente l'altezza dei div... poco male...

p.s. ma non è assurdo che non vi sia un comando css...per una cosa così banale... vertical-align middle a che serve?
p.s.2 si stava meglio quando si stava peggio aridateci i table

[KillerWorm]

Grazie KillerWorm,
per la risposta.

Ti informo che il codice funziona (inserito nel div padre), ma ho dovuto indicare obbligatoriamente l'altezza dei div... poco male...

Bene
Riguardo il problema dell'altezza bisogna capire quale sia la tua reale situazione. Se ti servono delle indicazioni più precise, come già detto, dovresti fornire un po' di codice, altrimenti si rischia di parlare di "aria fritta"

p.s. ma non è assurdo che non vi sia un comando css...per una cosa così banale... vertical-align middle a che serve?

E' un problema legato all'algoritmo CSS, vedi ciò che ho risposto in questo post (nella discussione che ho linkato sopra):
https://forum.html.it/forum/showthre...1#post25511363

Riguardo la proprietà vertical-align il suo uso è ristretto a particolari situazioni. Serve sostanzialmente per l'allineamento di elementi inline all'interno del flusso del testo, ad esempio applicato ad un elemento img lo allinea relativamente al testo circostante; oppure per l'allineamento del contenuto in elementi td.

Tieni anche conto che prima dell'avvento di Flaxbox si utilizzavano diverse tecniche e hack per risolvere problemi del genere (nella discussione che ho linkato ci sono alcuni altri link a riguardo).

p.s.2 si stava meglio quando si stava peggio aridateci i table

La questione è che ogni cosa andrebbe collocata nel posto appropriato. Le tabelle servono a rappresentare dati tabellari; se questa è la tua situazione, nessuno ti vieta di usarle. Per i layout sono invece stati sviluppati altri metodi, vedi appunto Flaxbox, ma anche CSS Grid che attualmente risolve varie problematiche riguardo la costruzione di layout a griglia.

Per maggiori informazioni su questi argomenti (e relative proprietà CSS) ti invito a dare uno sguardo al capitolo Layout e suoi elementi dei link utili CSS.

Buon proseguimento