CSS Grid layout contiente funciones de diseño dirigidas a los desarrolladores de aplicaciones web. El CSS grid se puede utilizar para lograr muchos diseños diferentes. Destaca por dividir una página en regiones principales, o definir la relación en términos de tamaño, posición y capas entre partes de un control construido a partir de primitivas HTML.
Al igual que las tablas, el grid layout permite a un autor alinear elementos en columnas y filas. Sin embargo, son posibles más diseños o más sencillos con CSS grid que como lo eran con las tablas. Por ejemplo, los elementos secundarios de un contenedor de cuadrícula podrían posicionarse de manera que se solapen y se superpongan, similar a los elementos posicionados en CSS. Por ejemplo:
Los Grid tienen varias formas de visualización entre las que destacan: "dipslay:grid" y "display:inline-grid". Siendo la primera la forma por definición.
Dentro de los Grid, se pueden dejar huecos en blancos entre las filas y columnas con la propiedad "grip-grap", que es una mezcla de las propiedades "grip-row-grap" y "grip-column-grap".
La sintanxis de est propiedad es Grip-grap: |grip-row-grap|px |grip-column-grap|px. Donde se colocan las distancia en la medida que quermos entre filas y columnas respectivmente.
La propiedad Grid es más extensa, pero en esta página he decidido poner las propiedades más importantes. Las demás se encuentran aquí