Archived topic
Positioning Image in GenerateBlocks
3 replies · Started by jm1991 on May 22, 2022
Hi there,
I created a GenerateBlocks heading for my front page. It's not finished yet. I still intend to add padding and some text underneath the heading tag.
However, within the heading, I added an image that looks good on desktop, but squashes the heading tag on mobile.
I want the image to sit under the heading tag (and additional text I'll add) on mobile specifically.
I added a class name to the image, .profile-image, to try and position below the heading tag with some CSS, but I haven't been able to nail it.
Help here would be appreciated.
Cheers.
Hi there,
you have a GB Grid block, with only one Column, add a second column to it.
https://docs.generateblocks.com/article/grid-overview/#adding-more-grid-items
Then delete your current Image Block and add it inside your new column.
By default the Columns will stack 100% wide on mobile.
If need be you can adjust the column widths for Desktop, Tablet and Mobile and re-order them:
https://docs.generateblocks.com/article/container-overview/#layout-–-grid-item
Thanks for this! Apologies for the late reply. I've been abroad for two weeks, but as ever, I appreciated the super quick response. Keep up the amazing customer support!
Glad to be of help!
