Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Posicionando elementos con Flexbox

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

1 respuesta

¡Hola, Carla, espero que estés bien!

Para centrar los elementos dentro de una sección usando Flexbox, puedes utilizar la propiedad justify-content. Tienes varias opciones dependiendo de cómo quieras distribuir el espacio:

  1. justify-content: center;: Esto centrará ambos elementos dentro de la sección, distribuyendo el espacio libre a ambos lados.

  2. justify-content: space-around;: Distribuirá los elementos con espacio alrededor de cada uno, lo que significa que habrá espacio antes, entre y después de los elementos.

  3. justify-content: space-evenly;: Distribuirá los elementos con espacios iguales entre ellos y los bordes del contenedor.

Cualquiera de estas opciones funcionará para centrar los elementos, así que puedes elegir la que mejor se adapte a tu diseño. Aquí tienes un ejemplo de cómo aplicarlo:

section {
    border-style: solid;
    border-color: red;
    margin: 10%;
    display: flex;
    justify-content: center; /* O space-around, o space-evenly */
}

Espero que esto te ayude a posicionar tus elementos como deseas. ¡Bons estudos!