Hi ladies and gentleman :)
I´m building an react app. There I want to build a grid like masonry with mantine. The width and the height of the components that are shown, have to be autofill the grid, without space (so like on masonry). Is it with mantine possible?
There is an additional task, that the components have to be displayed or displayed. Depend on the selected Components, the grid is autofilling the grid without any space. That would be the perfect solution.
An prefered solution looks like: https://medium.com/@andybarefoot/a-masonry-style-layout-using-css-grid-8c663d355ebb
I tested some settings of mantine grid, like SimpleGrid and ...
If you go by default on mantine grid that's not possible because of the <Grid.Col>
will take the same height as its row siblings. What I recommend is going for 6 columns and using the Cards with different heights but still, you will have some issues with responsive in this case, use the mantine responsive hook to check the page width.