Streaming live at 10am (PST)

Can't center align div block inside column wrapper

I tried creating a layout using two columns: (1) an image column on the left and (2) a description column on the right. I’ve been trying to fix the alignment so that the description aligns to the center of the image so every row would have equal spacing but can’t get it to happen. Not sure what I’ve done wrong. Would appreciate any help.

You can ignore the pics and text. Just placeholders for now.


Here is my site Read-Only: https://preview.webflow.com/preview/ground-up-e74556?utm_medium=preview_link&utm_source=dashboard&utm_content=ground-up-e74556&preview=32944907250b3ac773ad6cb1f2170959&mode=preview

Hi @pocks,

Your read-only link isn’t working:

image

May I suggest that instead of a using the column element, you try a grid?

You could place a div and set a background image then a paragraph and set its alignment.

Grid will also be better when you would optimise the design for different devices.

Thanks!

@RohanGanachari Thanks for that. I’m not sure why the link didn’t work but now it does.

I already set up the structure using a grid and have tried both headers and paragraphs to get it right but I’m guessing there must be a way to redo the grid I already have then?

Hi @pocks,

The link works now.

And yes, there’s a more efficient way to do this.
Remember - lesser the elements, the better.

This is the current setup.

The same can be achieved with lesser elements. :slight_smile:

@RohanGanachari I’m actually still having trouble. How should I restructure the current grid I already have which already has the nav, top headline, and footer?

Hi @pocks ,

You have many conflicting elements in 1 grid.

I’d recommend you start over with a new grid.

  1. Use this grid as a container by adding a max-width and centring it.

  2. Add 1 div for your background image.

  3. Add another div as a wrapper, and add a heading & paragraph or any other element in it. You can align the div wrapper as you please.

Use this section only for your projects.

Add 2 new sections for footer and nav bar.

If you need more help, don’t hesitate to ask.
Happy webflowing! :webflow_heart: