Para crear espacios entre trazas, utilizamos las propiedades grid-column-gap para los espacios entre columnas, grid-row-gap (en-US)") para los espacios entre filas, y grid-gap para configurar ambos a la vez.
.png "carbon(411).png")
Estos espacios pueden expresarse en cualquier unidad de longitud o en porcentaje, pero no en unidades fr.
Las propiedades *gap solían tener el prefijo grid-, pero esto se ha cambiado en la especificación, porque la intención es hacerlas compatibles con diversos métodos de diseño. Por el momento, Edge y Firefox admiten las versiones sin prefijo, y las versiones con prefijo se mantienen como un alias, por lo que será seguro usarlas durante algún tiempo. Para quedarte en lo seguro, y que tu código sea más a prueba de balas, puedes duplicar y añadir ambas propiedades.
.png "carbon(412).png")
Puedes repetir todas tus trazas, o una sección de tu lista de trazas, con la notación de repetición. Cambia tu lista de trazas por lo siguiente:
.png "carbon(413).png")
Ahora vas a tener 3 trazas de 1fr, igual que antes. El primer valor que pasas a la función de repetición son las veces que deseas que la lista se repita, mientras que el segundo valor es una lista de trazas, que puede constar de una o más trazas.
Obra publicada con Licencia Creative Commons Reconocimiento Compartir igual 4.0