Create different page layouts for mobile and desktop

I have a page that is 4 custom blocks with HTML and an image in each. On the desktop site they are stacked opposite as you scroll down (text on right, text on left, and so on) so it is aesthetically pleasing and easy to read. But the mobile site shows the photos bunched together and the text bunched together, since they are not beside each other. How can I adjust this just for the mobile site so it’s photo - text - photo - text - and so on, instead of photo - photo - text - text.

Thanks!

1 Like

Hello @SmashGrrrl ,

For mobile with media query css use order property.
You can check this example how css order works.

Thanks

@SmashGrrrl

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.