Split Hero with Centered Container?

I’ve attached a picture of my design here. I’m looking to build a hero section with two columns at 50% and then have content within each of those columns. My design is set up to have a 1280px container for all non full-width imagery/backgrounds (ie the same width as the navbar). How do I contain the information to that 1280px width on a larger screen? I haven’t been able to figure out how to align information to that 1280px container.

Here is a read-only link to my Webflow project: Webflow - SHAPE


you could have the image & solid color split as an absolute positioned div/grid (relative to the hero section) in the background, while the content itself is placed in a grid inside of your normal container on top.

That sounds awesome! Is that easy to do?

Yeah, it’s quite simple. I made a super quick example, hopefully it helps:


So helpful! I really appreciate your help! :star_struck:

1 Like