Cannot get column to line up with edge of project

I am just new to learning Webflow and I’m setting up my own personal website for my UX projects. I’m struggling to make flex/columns/WHATEVER work for me:

In my Figma design, I have a section with a photo on the left, and on the right a heading with a paragraph beneath it. I have tried physically every search and change I could possibly make on this project, and for the life of me I cannot get the paragraph text to line up with the “edge” of my project… in other words, I want the text to be in line with the last letter of CONTACT in the navbar.

You can see the design how it is supposed to look in the photo below:

I am begging for help! Please teach me this Obiwan so I never have to go through this again!!! This project has several of these sections and I’m panicked!

Here is my site Read-Only: Webflow - BEDROCK DESIGNS

You need to learn how to properly use Flexbox and CSS grid as well as using that in combination with units of measurement like EM/VW/PX to make it responsive

There’s lots of resources out there I’d suggest checking out Timothy Ricks on YouTube he has some great videos on Figma to Webflow

It seems like there’s just a lot of fundamental foundational errors in the way you set up your divs and containers that’s why you’re having an issue

Hey @Kelsey_Connors

So @franzruggiero is right here, there are some fundamentals to learn but to give you a direct response.

1: Your navigation container is set to a width of 1448px.
2: Your section container should match that, and be set to 1448 and centered.

Thank you I so appreciate this. I’m struggling to understand Flex and what it does even with taking a full course in CSS and HTML!!

Yeah, I get that.

Check out:

Specifically: Webflow 101 crash course | Webflow University

Honestly, this will give you the basics and get you going.

Hey there, it’s been a few days but I wanted to say thanks I’ve been following Timothy Ricks and I finally feel like I have an understanding of Flex!

1 Like