Grid.Col xs={6} does not resize the columns to have 2 columns in XS viewport | Mantine | Page 1

inland gull Jul 6, 2023, 9:39 AM

#

you are not alone me too i thing xs is not working

#

this is my mobile view got result
like this but i found solution

#

now on my mobile

#

i use set span to 12 and then you set sm md lg xl

#

that will help you a lot

#

@gilded turtle i think xs on grid is not working directly i notice that but now i can make it work by my solution

wispy solar Jul 16, 2023, 4:08 AM

#

I am having this same problem, but even with sm. I tried this solution on the columns, but it didn't work.

unique adder Jul 16, 2023, 7:58 AM

#

You can find explanation on how columns work here – https://mantine.dev/core/grid/#responsive-columns

Grid component, as well as other components with responsive props, use mobile-first approach. If you set xs prop it means that it will be applied when viewport is larger than xs.

Grid

Flexbox grid system with variable amount of columns

wispy solar Jul 16, 2023, 6:32 PM

#

Okay, it annoys me that I didn't get this despite reading that section several times before asking this question. Thank you, Vitaly, as always.

#Grid.Col xs={6} does not resize the columns to have 2 columns in XS viewport