when using css grid, the content starts to overflow on screens less than 375px. one solution i suppose is overflow:hidden but the content starts to disappear. any tips here?
i solved it by using flex and flex-direction: column and it starts scaling nicely on smaller screens, but i was wondering if there was a css grid approach to this
@tlauffs
Posted
Hi, great solution. Yes you can use grid for this. For example you can use 'grid-template-columns: repeat(2, 1fr);' to create 2 columns of equal width that will shrink as the screen shrinks. A great tutorial that helped me understand how to use grid is here: https://www.youtube.com/watch?v=rg7Fvvl3taU
Marked as helpful
@piushbhandari
Posted
btw i used a different bg color on the 3rd grid cell b/c figma wouldn't give me the color.
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord
