vertical texto justificar imagen derecha contenido como centrar alinear alinea ala acomodar css text positioning

justificar - CSS: Posiciona el texto en el centro de la página.



como se alinea a la derecha en html (3)

Aquí hay un método usando display:flex :

.container { height: 100%; width: 100%; display: flex; position: fixed; align-items: center; justify-content: center; }

<div class="container"> <div>centered text!</div> </div>

Ver en Codepen
Compruebe la compatibilidad del navegador

Me gustaría colocar un <h1> en el centro de la página de cualquier usuario. He estado buscando en Internet y todos ellos lo colocan en el lugar incorrecto. ¡Gracias!

ACTUALIZACIÓN: me refiero a vertical y horizontal! En el medio exacto!
TAMBIÉN: No hay nada más en la página.


Aunque hayas aceptado una respuesta, quiero publicar este método. Uso jQuery para centrarlo verticalmente en lugar de css (aunque ambos métodos funcionan). Here hay un violín, y de todos modos publicaré el código aquí.

HTML:

<h1>Hello world!</h1>

Javascript (jQuery):

$(document).ready(function(){ $(''h1'').css({ ''width'':''100%'', ''text-align'':''center'' }); var h1 = $(''h1'').height(); var h = h1/2; var w1 = $(window).height(); var w = w1/2; var m = w - h $(''h1'').css("margin-top",m + "px") });

Esto toma la altura de la ventana gráfica, la divide por dos, resta la mitad de la altura de la h1 y establece ese número en la margin-top del margin-top de la h1. La belleza de este método es que funciona en h1 s de líneas múltiples.

EDITAR: Lo modifiqué para que se centrase cada vez que se cambia el tamaño de la ventana.


Prueba este CSS:

h1 { left: 0; line-height: 200px; margin: auto; margin-top: -100px; position: absolute; top: 50%; width: 100%; }

jsFiddle: http://jsfiddle.net/wprw3/