Archived topic
Displaying Images differently on mobile and desktop
2 replies · Started by Mark on April 11, 2022
Hi, So on a website I'm designing I'm trying to create 6 categories in 2 rows so they're displayed 3+3 on desktop it comes out fine. However, on mobile due to size of the images I need it to display the different categories 2+2+2. On mobile I've set the size of the container to 50% and it they come out to 2, 1, 2, 1. Is it possible to make them appear as 2+2+2 on mobile without affecting it on desktop?
https://gyazo.com/64512039a27edb44e7c3fe188c444bdc this is how I want it on desktop which it currently is.
https://gyazo.com/9a47214b428d1d9ef904cc8fad57f9a7 this is how I've made it appear on mobile.
I'd like to fill that white space with another image so it becomes 2+2+2 displayed on mobile onlly.
Hi Mark,
You can achieve such through a Grid Block with 6 containers: https://share.getcloudapp.com/p9u6Qwgy
Kindly set the Container Blocks’ width to 33% on Desktop and 50% on Mobile.
See: https://share.getcloudapp.com/GGulzrnY
Also see: https://share.getcloudapp.com/wbuzQPZy
Hope this helps! Kindly let us know how it goes. :)
