html - texto - Cómo alinear verticalmente una tabla en CSS

centrar texto horizontalmente y vertical css

Question

¿Cómo puedo alinear verticalmente una tabla en el medio de la pantalla con css?

Answer 1

En general, algo parecido a esto funciona bastante bien en cualquier elemento de bloque con una altura definida.

table {
position: absolute;
top: 50%;
margin-top: -50%;
}

Centrar en la página es más difícil ya que no tiene una altura definida, pero creo que esto funciona.

html {
height: 100%;
}

Puede encontrar algunas diferencias de navegador, actuar en consecuencia.

Answer 2

Si puede darle a la mesa una altura fija, entonces puede adaptar el CSS desde este sitio que acabo de hacer.

Es un poco complicado de explicar, pero básicamente establece un ''horizonte'' de 1 píxel a una altura del 50% de la pantalla alrededor de su contenido, luego compensa el 50% de su altura con la parte central del elemento (es decir, su tabla).

EDITAR: Aquí está el artículo original de mi solución, con explicación y todo.

Answer 3

Dicho brevemente, simplemente haga que su cuerpo sea una tabla, porque vertical-align sí funciona en las celdas de la tabla:

body, html {
height: 100%;
}
body {
display: table;
}
#wrapper {
display: table-cell;
vertical-align: middle;
height: 80%;
}

Esto alineará verticalmente tu pagewrapper a la mitad y deja que sea fluida 80%