Solucionado (ver solución)
Solucionado
(ver solución)
1
respuesta

[Duda] como espaciar los elementos en un grid

Referente al curso Flexbox: Posicione elementos en la pantalla, en el capítulo Grid principal y limitaciones de Flexbox y actividad Cómo espaciar correctamente los elementos de un grid

por Evelyn Priscila Mejia Vigil
| 126.8k xp | 141 posts

```HTML:

<div class="grid">
  <!-- primera línea -->
  <div class="course"></div>
  <div class="course"></div>
  <div class="course"></div>
  <!-- segunda línea -->
  <div class="course"></div>
  <div class="course"></div>
  <div class="course"></div>
  <!-- tercera línea -->
  <div class="course"></div>
  <div class="course"></div>
  <div class="course"></div>
  <!-- cuarta línea -->
  <div class="course"></div>
  <div class="course"></div>
</div>

CSS:

.grid {
  display: flex;
  flex-wrap: wrap;
}
.course {
  width: 31.3%;
  margin: 1%;
}
 No entendí muy bien este ejercicio
1 respuesta
solución!
por Rafaela Rocha
| 2874.2k xp | 8758 posts
Alura Scuba Team Scuba Team

¡Hola Evelyn!

En este ejercicio se está utilizando la propiedad "flex-wrap" para permitir que los elementos de la clase "course" se ajusten a la pantalla. La propiedad "margin" se utiliza para agregar un espacio entre los elementos.

En este caso, se está utilizando un margen del 1% para los elementos de la clase "course". Si deseas aumentar o disminuir el espacio entre los elementos, puedes ajustar el valor del margen.

Por ejemplo, si deseas aumentar el espacio entre los elementos al 2%, puedes cambiar el valor de "margin" a "2%".

Espero que esto te ayude a entender mejor el ejercicio. ¡Si tienes alguna otra pregunta, no dudes en preguntar! ¡Espero haber ayudado y buenos estudios!

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