Archived topic

How to make my image above the text in mobile

1 reply · Started by Daniel on February 10, 2022

Viewing posts 1–2 of 2

February 10, 2022 at 8:37 am #2112851

Hey guys,

So for my product review pages I use reusable blocks to create a little product box. I manually divide the image from the text and it kinda of creates a grid.

However on mobile my text gets screwed up because of the image size. I manually try to make the image bigger so the text falls under the picture.

So if pictures are smaller in the mobile version looks pretty bad. How box looks on mobile when my image is a little too small

Is there a way with a grid block or even CSS that I can make my grid be 50% on desktop and 100% on mobile so pictures will be above text automatically and not depending on image size?

February 10, 2022 at 11:03 am #2113106

Hi there,

I would recommend using the grid block from GenerateBlocks:
https://docs.generateblocks.com/article/grid-overview/

Then you can set specific container widths at each responsive screen:
https://docs.generateblocks.com/article/container-overview/#layout-%E2%80%93-grid-item

This archived topic is closed to new replies.

Start building better websites today.