[Resolved] Aligning hero image text so its relative with body content

[Simon]

hi,
Sorry if this is a really basic question, but I was hoping to align the content within the hero image, so it lines up with the content in the container below.
Thanks for looking.

[Ying]

Hi Simon,

Not sure I understand your question, do you mean you want the purple box and the green box to be aligned?
https://www.screencast.com/t/yBy0q9rCBKS

If so, can you link us to your site?

[Simon]

Hi Ying
Thanks for such a quick response! Yes, that’s precisely it.

[Leo]

Currently, this is the setting for the page hero GB container:
https://www.screencast.com/t/N8QVSUseAxv

Can you try setting those values to match the content GB container:
https://www.screencast.com/t/aaVxse55Xi3M

Let me know if this helps 🙂

[Simon]

Hi Leo
Thanks for that.
I made those changes but I guess there must be something I haven’t done right somewhere else!
Thanks

https://www.dropbox.com/s/3m1spdijk7tl9g3/Screenshot%202023-03-20%20at%2020.34.40.png?dl=0

https://www.dropbox.com/s/zr9gvx5afy4it4l/Screenshot%202023-03-20%20at%2020.35.07.png?dl=0

[Fernando]

Hi Simon,

Can you provide admin login credentials so we can take a closer look at your setup?

Please use the Private Information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

[Simon]

Hi Fernando.
Yes, of course, thanks ever so much.

[Fernando]

Insert another Container Block inside your Container Block in the Page Hero Block Element. Move the Content inside this new Container Block. Then, give it a max-width of 1300px. Add padding as well.

Relevant articles:

https://docs.generateblocks.com/article/layout-options-overview/
https://docs.generateblocks.com/article/spacing-options-overview/

[Simon]

Thanks Fernando. I have done that although whatever padding I choose it doesn’t seem to line up. Sorry for being such a lemon. I wish I was as clever as the GP support team!

[David]

Hi there,

open the List View in the left handside of the editor top bar.
Select the second Container Block.
Then:

Go to Spacing, set some padding on all sides.
Then in the Margin Left and Margin Right type auto

Then go to Sizing and set the Max Width to 1200 or whatever value to match your layout.

[Simon]

Thanks David, I got that lined up nicely. Thanks for your help! And to Ying and Fernando as well.
Cheers!

[David]

Glad to hear that

[Author]

Posts