Div containing text extends to edge of screen

Community resources General
1

I have a hero section with page titles. The page titles have a div box with a colored background. The customer wants the color box to extend to the far left of the screen, but also keep the text contained within the width of the container. Similar to this, but without the slant: Expertise - About - TSX:MOZ | Marathon Gold.

Read-only link: https://preview.webflow.com/preview/signal-gold?utm_medium=preview_link&utm_source=designer&utm_content=signal-gold&preview=1e345ebe095657e2912211f23efe8ed1&pageId=626015c79c27fc27eaa80b21&workflow=preview

2

Screen Shot 2022-04-29 at 8.22.42 PM
Screen Shot 2022-04-29 at 8.22.42 PM1920×1200 166 KB

Something like so?

Remove the left margin on the hero section
Add extra left margin on the text bg
And that’s it

3

AliSaeed,

Thanks for the quick response. I got the full bleed to work - I ended up setting the left margin of the textbg to -100VW so that it always hits the side, no matter how large the screen gets. But I’d ultimately like the text to remain inside the site’s container width like so, even when the window is resized:
e84a983520fb8a965f86c0ec9c6aeb07e0a3f4d3_2_690x431

1 Like
4

I made a loom. Check this out and see if it helps out

5

AliSaeed - Thanks that was exactly what I was trying to accomplish! Now to decide if I want to rebuild the whole site as a grid…

1 Like
6

Awesome! Let me know if you need anything