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).