Streaming live at 10am (PST)

Newbie - Grid with 3 cells

OnIy started Webflow about a week ago so this could be something really simple…

I’m trying to create a grid with 3 cells - 1 large cell and 2 smaller cells alongside like this: 3%20Square%20Grid

From the tutorials it appears that I can create a 4 cell grid and then merge the cells in the first column to create a single cell for that column, whilst leaving 2 cells in the second column. I can’t seem to do that for the life of me. What am I missing?


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

Hi and welcome

You don’t merge cells, You pdf build Divs on the cell’s Grid. Create A 4 cell grid and on top of that grid create 3 divs, one div of 2 cells and another 2 divs of 1 cell each.

Thank you @shokoaviv I’m excited to be here. I’m all but addicted to Webflow right now.

I couldn’t find anything on pdf build divs and maybe couldn’t understand your video because of that.

If I could see a screen-shot of your folder structure I may be able to work the rest out from there.

btw, do I need a grid at all? Is there a way to have 3 boxes (1 large, 2 smaller) in a container without a grid?

Auto correct :open_mouth:

Nothing to do with pdf, sorry about that.

The easiest way is Grid.

@shokoaviv Thank you, I wondered if it was a typo…

Your demo, and everything I read around grids, suggest that to span a grid child over multiple cells, I should be able to select the grid child on the canvas and drag the bottom right handle. But I don’t see a bottom right handle, neither in plain view nor in Edit Mode. How do I access it?

make sure you’ve got the actual element (not a child) selected. So if you add a div with other elements, only the div will have the red outline that shows you you can move it. It’s not just the bottom right, you can grab it at all 4 corners

Access the Div You want to grab via the Navigator (on the top right - see the pic below)

11

Make sure the Div is selected, now click on the orange caption that says: “place the item” and now you should see the Div highlighted with red frame and 4 sweet corners

Hope that it helps :slight_smile:

That was exactly what I was looking for, thank you.

1 Like