The grid component is an alternative to containers for laying out content on your screens. Grids allow you to drag and position components exactly where you want them to go, without needing to think out layout direction and alignment.
Components that you place inside grids can be dragged around and positioned wherever you like. They can also be resized by dragging the resize anchors available on all corners and edges of your components.
The grid component only has 2 settings - the number of rows and the number of columns. Both of these are configurable from 1 to 32. Larger numbers of rows and columns allow you to be more granular with your layouts and sizes.
To ensure a smooth design experience, only certain components can be placed directly inside grids. Those components are containers and blocks. To nest other components inside a grid, first place them inside a container. You can then use the normal layout experience with containers to configure your alignment and direction, but the container component itself can be dragged around inside the grid, and resized as you see fit.
Updated about 1 month ago