Layout using grid?

Hi,

I need to create a 2-column block containing an image zone and corresponding text zone on each row.

In the case of multiple rows, the image and text position need to alternate between image left, text right, and visa versa.

The width of the text zone always matches the width of the image zone. However, the depth of each text zone varies depending on the amount of content. This means the image zone depth also varies.

What is the best way to build these blocks in Webflow so I can use fixed-ratio images (800x600px)?

Just to be clear, I don’t need the images to display at a fixed ratio, I need the image placeholder to display at the same ratio as the corresponding text zone without distorting.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

this is what I’m trying to go for using Webflow

instead. it does this

image

this is how i been formatting it

@nadalbay this is a pretty straightforward set-up. That’s good :slight_smile: . You’re going about it in a challenging way, though. It seems you’re trying to put the whole page into a grid. It would be easier to tell if you shared your read-only link How to Enable a Webflow Share Link but that’s what I can tell from your screenshot.
The best way to do this is to break up your page into sections. Take a look at this template https://preview.webflow.com/preview/coffeestyle-template?utm_source=coffeestyle-template&preview=f343a4e3ad07d203e933a41bad8ddb37 as an example. It’s not the same layout but you’ll see each part of the site is in its own section/container. This makes it much easier to work with. I’ve built a site (and changed it afterwards :see_no_evil:) just using grid because I had a layout with lots of different blocks and pieces. This is much easier to do without grid.

thank you for your help I understand now