Sí se especifica las 2: grid-template-columns: ; grid-template-rows: ; Las propiedades: justify-content: ; align-content: ; ¿Ya no tendr...

Mauricio Doncel

Mauricio Doncel

Pregunta
studenthace 4 años

Sí se especifica las 2:

grid-template-columns: ;

grid-template-rows: ;

Las propiedades:

justify-content: ;

align-content: ;

¿Ya no tendría sentido declararlas?

5 respuestas
para escribir tu comentario
    Mauricio Doncel

    Mauricio Doncel

    studenthace 4 años

    Gracias. Mi error era probar siempre usando medidas tipo fr y ninguna otra como px. Ejemplo grid templates colums :repeat (2, 1fr) ; grid templates rows : :repeat (2, 1fr) ;

    por lo tanto: justify-content y align-content No me servían de mucho.

    Estefany Aguilar

    Estefany Aguilar

    teacherhace 4 años

    Hola Mauricio ! Gracias por tu pregunta. Por qué dices que ya no tendrían sentido declararlas ? Cuál es el resultado esperado ? Ambos grupos de propiedades hacen cosas muy diferentes:

    grid-template
    te ayuda a crear filas y columnas (según como sea el caso) y
    justify-content
    y
    align-content
    son para alinear contenido.

    Juan Carlos Pinzón

    Juan Carlos Pinzón

    studenthace 4 años

    No necesariamente no tienen sentido, creo que eso depende de la cantidad de elementos que haya y también como los posiciona en la grid si es el caso

    Mauricio Doncel

    Mauricio Doncel

    studenthace 4 años

    Es que al crear una el grid por ejemplo: grid templates colums :repeat (2, 1fr) ;
    grid templates rows : :repeat (2, 1fr) ; pues declaraciones como: justify-content: center; align-content: space-evenly; No se aplican por qué la regila no deja solo es posible posicionar dentro de las celdas es decir justify-items: ; align-items:;.

    Héctor Eduardo López Carballo

    Héctor Eduardo López Carballo

    studenthace 4 años

    Hola!

    Los atributos

    grid-template-...
    definen el alto y ancho de los elementos, mientras que
    justify y align
    definen su alineación, por lo que todas son necesarias dependiendo del resultado que busques.

Curso de CSS Grid Layout [Empieza Gratis]

Curso de CSS Grid Layout [Empieza Gratis]

Aprende a crear diseños web modernos con CSS Grid, alineando y posicionando elementos de manera precisa. Ideal para proyectos creativos, entenderás cómo automatizar y ajustar layouts para diferentes dispositivos.

Curso de CSS Grid Layout [Empieza Gratis]
Curso de CSS Grid Layout [Empieza Gratis]

Curso de CSS Grid Layout [Empieza Gratis]

Aprende a crear diseños web modernos con CSS Grid, alineando y posicionando elementos de manera precisa. Ideal para proyectos creativos, entenderás cómo automatizar y ajustar layouts para diferentes dispositivos.