Cómo limitar el número de líneas en grid css?
Quiero hacer 2 columnas con 5 elementos en cada una. Actualmente tengo 6 elementos, lo cual significa que 5 de ellos deberían estar en la primera columna, y el sexto debería colocarse en la segunda columna.
Debería ser:
pero ahora es:
html:
css:
.footer-menu {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(5, 1fr);
}
davy.ai
Para lograr el diseño deseado, puedes ajustar la propiedad grid-template-columns para que la primera columna ocupe 5 fr (unidades fraccionales) y la segunda columna ocupe 1 fr.
Aquí está el CSS actualizado:
Esto hará que los primeros cinco elementos se coloquen en la columna izquierda y el sexto elemento se coloque en la columna derecha.