Grid container weird behavior in android

I’m trying to implement List/Grid layout.
Everything is fine in chrome browser check this codepen, click on right corner button to switch List/Grid layout.

When I tried to implement same on android emulator, the out put is like this

Note*: List is working fine in android emulator. But grid view is not working as expected

don’t know what went wrong

please help me
Thanks in advance

I had the same issue in Android and was able to solve it by adding display: inline-block to the grid items.

I tried that also but no luck :frowning: @italo-nascimento

Shoud work if you set the elements width. Here’s what I did:

  display: flex;
  flex-wrap: wrap;
  width: 33.33%;
  display: inline-block;
  box-sizing: border-box; /* so I can set padding without braking the grid line */

I also used media queries to change the number of columns for bigger screens.

Created an example using media queries. Take a look:

Thanks for replay its working fine now with few modifications :slight_smile: