Archived topic
Image and text order in desktop and mobile
3 replies · Started by Jose on March 4, 2022
Hello there,
I'm creating some articles and I'd like for text and images show in specific ways in desktop and mobile.
I added a container and then a 2 halfs grid.
In desktop, I want to show on the left side of the grid an H2 and some text below, and on the right side I want to show an image.
In mobile, I want to show the H2, then the image and then the text.
The problem is I'm not able to do this, because the image will always be below the text in mobile.
Is there a way to solve or do this?
Thanks!
Hi there,
you would need to duplicate the image block and place one of them after the H2 Heading.
Then you can add hide-on-* classes to the image blocks > Advanced > Additional CSS Class(es) field to show/hide them for the specific devices:
https://docs.generatepress.com/article/responsive-display/#using-our-hide-on-classes
Solved it!
Thanks a lot!
Jose
Glad to hear that