Código de CSS - Centrar un elemento verticalmente utilizando :before

Val: 493

Centrar un elemento verticalmente utilizando :before

Publicado el 10 de Marzo del 2020 por Katas (47 códigos)

2.069 visualizaciones desde el 10 de Marzo del 2020

Código que muestra como centrar un elemento verticalmente utilizando el pseudo elemento :before

centrado-vertical-con-pseudo-elemento

Publicado el 10 de Marzo del 2020

2.070 visualizaciones desde el 10 de Marzo del 2020

<!DOCTYPE html>

<html lang="es">

<head>

    <meta charset="UTF-8">

    <style>

    .center {

        height: 300px;

        border: 1px solid #808080;

        text-align:center;

    .center:before {

        content: "";

        display:inline-block;

        height:100%;

        vertical-align: middle;

    </style>

</head>

<body>

    <div class="center">

        <span>Contenido centrado. Vertical y horizontalmente</span>

    </div>

</body>

</html>

11 de Marzo del 2020

No ha dejado ningún comentario

Responder

12 de Marzo del 2020

Que bueno!!!

Responder


Nombre

Correo (no se visualiza en la web)

Valoración

Comentarios...

CerrarCerrar

Es necesario revisar y aceptar las políticas de privacidad

Acepto las políticas de privacidad

http://lwp-l.com/s6013

Poner un div encima de otro div con CSS

Centrar un elemento horizontal y vertical sin saber el tamaño de su contenedor