Originariamente inviata da
KillerWorm
Centrare verticalmente un elemento con CSS, in generale, non è così intuitivo o scontato. A seconda dei casi è possibile usare diversi metodi tra cui
flexbox,
table-cell,
top:50% e
margin-top negativo o
transform:translateY(-50%),
display:inline-block e
vertical-align:middle,
line-height uguale a
height, e altri eventuali.
Sarebbe dispendioso, oltre che fuori tema, descrivere qui tutti questi metodi; se ti interessa approfondire, ti invito a fare qualche ricerca online del tipo "
css vertical align middle", dove sicuramente troverai molti esempi e tutorial.
Nel tuo caso posso supporre che ti basti applicare
line-height con un valore pari a
height per l'elemento
#home, ma lascio a te approfondire e decidere come meglio intervenire.
Consiglio inoltre di verificare opportunamente il tuo codice, noto diversi tag chiusi male. In questo caso potrebbe esserti utile l'uso di un validatore come
https://validator.w3.org/
Se poi hai interesse ad approfondire lo studio dei fogli di stile in generale, posso consigliarti di dare uno sguardo anche ai
link utili (tra le discussioni in evidenza).
Permessi di invio
Rispondi quotando