align-items flexbox en Internet Explorer

No estoy consiguiendo un centrado en la vertical con Internet Explorer. En los otros navegadores funciona perfecto, pero no en IE. No sé si estoy...

La FAQ align-items flexbox en Internet Explorer tiene

Pertenece a la categoría:
Pregunta
No estoy consiguiendo un centrado en la vertical con Internet Explorer. En los otros navegadores funciona perfecto, pero no en IE.

No sé si estoy haciendo algo mal. Este es mi CSS.

.bloque {
display: flex;
align-items: center;
min-height: 80px;
padding: 0 20px;
}
Respuesta de Julio Maldonado
Tu problema puede deberse a que IE necesita una altura en los elementos para saber cómo alinear verticalmente el contenido de ese bloque.

Lo podrías solucionar simplemente colocando una altura al elemento y creo que con eso lo tendrías listo.

.bloque {
display: flex;
align-items: center;
min-height: 80px;
padding: 0 20px;
height: 200px;
}

El problema es que no puedas marcar la altura de los elementos, en cuyo caso quizás tengas que buscar otras alternativas para la alineación vertical. Ahí depende de tu caso concreto y de cómo sea el contenedor donde estás colocando los elementos.

Igual simplemente jugando con el padding-top podrías darle una distancia de la parte de arriba que simulase ese alineamiento en la vertical.

Igual como sugerencia te podrías olvidar de ese problema y lo del padding puede que no sea algo tan negativo, si lo que se trata es que las cosas no se te peguen a la parte de arriba de tu contenedor. Depende de qué versión de IE estés focalizando, o igual de Edge. Supongo que flexbox funcione mejor en Edge. Ya en navegadores antiguos de Microsoft no se puede esperar que corrijan esos bugs.
Volver al árbol de categoríasVolver al árbol de categorías
FAQ relacionadas
Volver al árbol de categoríasVolver al árbol de categorías