Hola tengo esta duda, como puedo centrar mi contenido verticalmente? Si miran mi footer, las redes están centradas en vertical, pero fue...

Mateo Agudelo Echavarria

Mateo Agudelo Echavarria

Pregunta
student
hace 5 años

Hola tengo esta duda, como puedo centrar mi contenido verticalmente?

1.PNG Si miran mi footer, las redes están centradas en vertical, pero fue porque añadí un padding-top.

2.PNG3.PNG Entonces quisiera un consejo de como hacer esto de una mejor manera.

4 respuestas
para escribir tu comentario
    Nicolás Felipe Fernandez Fandiño

    Nicolás Felipe Fernandez Fandiño

    student
    hace 5 años

    Para no usar un display grid, puedes usar le text-align: center.

    Mateo Agudelo Echavarria

    Mateo Agudelo Echavarria

    student
    hace 5 años

    Muchas gracias a ambos

    Matías Criado

    Matías Criado

    student
    hace 5 años

    Hola Mateo por acá te dejo otra solución, aunque a mi parecer la sintaxis de John es mucho más simple, pero la dejo por aquí para ver otras formas de llegar al resultado ocupando margin y flex ;)

    footer { display: flex; } ul { margin: auto; display: flex } li { margin: 2rem /* margen a tu preferencia */ }
    John Cardenas

    John Cardenas

    student
    hace 5 años

    Hola, Mateo. Aprenderás a hacerlo más adelante, pero igual te digo:

    Puedes usar el

    display flex
    junto a
    align items
    y
    justify content

    footer ul { display: flex; justify-content: center; aling-items: center; }

    Con eso ya estaría :)

Curso de HTML y CSS [Empieza Gratis]

Curso de HTML y CSS [Empieza Gratis]

Crea vistas web fluidas y eficientes con HTML, CSS y Flexbox. Aprende a estructurar layouts adaptables, desde mobile a desktop, optimizando imágenes y aplicando buenas prácticas semánticas y de accesibilidad.

Curso de HTML y CSS [Empieza Gratis]
Curso de HTML y CSS [Empieza Gratis]

Curso de HTML y CSS [Empieza Gratis]

Crea vistas web fluidas y eficientes con HTML, CSS y Flexbox. Aprende a estructurar layouts adaptables, desde mobile a desktop, optimizando imágenes y aplicando buenas prácticas semánticas y de accesibilidad.