1
respuesta

Agregando espacio con Flexbox

.encabezado {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  order: 1; /* Cambiar el orden */
}

.menu {
  display: flex;
  list-style: none;
  order: 2; /* Cambiar el orden */
}

.menu-item {
  margin-right: 10px; /* Ajusta el espaciado entre los elementos del menú */
}
1 respuesta

¡Hola Kevin!

Por lo que veo en tu código, estás utilizando la propiedad justify-content para agregar espacio entre los elementos de tu encabezado. Esta es una excelente opción cuando se trabaja con Flexbox.

Sin embargo, si deseas agregar más espacio entre los elementos, puedes ajustar la propiedad margin de los elementos. En tu caso, puedes agregar más espacio entre los elementos del menú ajustando la propiedad margin-right de la clase .menu-item. Por ejemplo, si deseas agregar 20 píxeles de espacio entre los elementos, puedes cambiar el valor de margin-right a 20px.

Aquí te muestro cómo quedaría el código:

.menu-item {
  margin-right: 20px; /* Ajusta el espaciado entre los elementos del menú */
}

Espero que esta información te sea útil. ¡Buenos estudios!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios! :)