Align logo on homepage with blog matrix

Hi there,

Go to customzier > layout > container > Container Alignment, and select the Text instead of Boxes.

For more info: https://docs.generatepress.com/article/container-alignment/

Hi 'Text' is already selected. The settings under layout are:- Container width 1400px ; Separating space 10px ; Content separator 1.5em ; CONTENT LAYOUT = separate containers ; CONTAINER ALIGNMENT = Text ; CONTENT PADDING T=20 R-0 B=10 L=0

It's because the GB container which contains the posts has left and right padding, if you set the container's left and right padding to 0, they should align well.

Hi, I'm afraid that doesn't work either. What does work is to set the Header Width to "Contained" rather than "Full" this fixes the problem. However, if I do that the following CSS that adds a thin grey horizontal line under the header no longer extends to the edges of the screen. I've got this setup on the homepage new so you can see it at https://makemesustainable.com
Is there any way to adjust the CSS below to make the line extend to the edge of the screen i.e. beyond the contained header?

.site-header, #mobile-header {
border-bottom: 2px solid #ebebeb;
}

Hi there,

add the border to the top of the site container instead:

.site {
    border-top: 2px solid #ebebeb
}

Hi, Thanks. That worked on the home page but not on other posts / pages. Is there a way to get it to work across the whole site?

Ah... ok, thats a pain :)

1. Remove my CSS
2. Add back your CSS
3. Set the Site Header cotainer to full width
4. Add this CSS:

.inside-header {
    max-width: 1360px;
    margin: auto;
}

Adjust the max width to suit. Its simply the Cotainer Width eg. 1400px minus the sum of the left and right padding eg. 40px. So 1400 - 40 = 1360px

Perfect! Many Thanks

You're welcome