How to ensure header and footer are centered and aligned with content

[andreas2]

I have a header and a footer as reusable elements. Both are set to 1200 width in ui builder. My pages are also max width of 1200. The problem is that the main content is centered, but the header and footer stretch all the way to the sides.
I have tried to trick it by adding blank groups on the ends of the header and footer, which help somewhat, but it causes the header and footer to not be aligned at all with the content.

What’s the trick to getting headers and footers to align with the page correctly?

Many thanks in advance

[georgecollier]

Can you share a screenshot of the layout settings for your reusable element? Have you set a max width of 1200 for the reusable elements on your page, and then set them to align to centre?

[andreas2]

Thank you!
My footer settings (as example) are

My page setting is

And finally, my footer on the page is

Yet, the end result is this

And for further info, the page itself is set to column mode with the header and footer being the first and last element respectively.