Cada vez que tengo que vérmelas con un centrado vertical usando css es la misma historia. No hay forma de hacerlo.
La última vez parecía que con display:table-cell y vertical-align:middle la cosa iba, pero hace unos días tuve que volver a maquetar una página, tuve que centrar verticalmente un texto en un div… y que si quieres arroz Catalina, el texto se quedaba en la esquina inferior izquierda Y NO IBAN A MOVERLO.
La forma en la que lo conseguí esta vez, y espero que sea la definitiva, es la siguiente:
.div-padre {
position : relative;
}
.div-hijo {
position : absolute;
top : 50%; left : 50%;
transform : translate(-50%, -50>%);
}Ojo: también he visto que se puede conseguir usando flexbox. Al final no ha sido lo que he usado para el proyecto, pero poder podría haberlo usado.
.div-padre {
display : flex;
justify-content : center;
align-items : center;
}****************************************************************************
Espero que esta entrada pueda ser de utilidad, y si no, como siempre, aquí tenéis un gato para compensar.
Gran tip frekfifulisis!
Una pregunta. ¿Cómo puedo centrar los cuadros del salón? Por más que lo intento no lo consigo.
He probado a girar la estructura pero los vecinos no me dejan.
¿Podría poner un div entre la tele y el sofá?
Gracias fruity!