[Resolved] Page header image not full width on single post page

[Juha]

Hi!

I have the following CSS inserted to make the page header full width on the website:

.page-header-image.grid-container {
      max-width: 100%;
      margin-top: 0;
}

.page-header-image img { 
      width: 100%; 
}

When I open a single article, the header image gets resized to the container width of the blog. What do I do to make the page header width universal?

[Leo]

Hi there,

You can set the container width to full in page header: https://docs.generatepress.com/article/page-header-content/#container

[Juha]

That seems to work ok, thanks. Though enabling it creates a space between the header image and the top menu bar. Though it doesn’t look that bad and I may be able to be ok with it, if there’s anything to make the space go away, I’m all ears.

[Leo]

Try this CSS:

.separate-containers .page-header-image,
.separate-containers .page-header-image-single {
    margin-top: 0;
}

[Juha]

That solved the problem on the front page, but not on the single article pages.

[Leo]

Can you link me to one?

[Juha]

Yeah sure, here’s a link: http://www.kajaaninharrastajateatteri.fi/uutiset/khtn-15-vuotisjuhlamusikaali-lahestyy/

[Leo]

Edited the code above: https://generatepress.com/forums/topic/page-header-image-not-full-width-on-single-post-page/#post-402215

[Juha]

THANK YOU! You’re a wizard! Everything’s working now as expected, thanks again!

[Leo]

No problem!

[Tim]

Hi Tom and GP Team.

I added a logo that is full width. . . and want it to be 100% width or have the background of the header container match the background of the logo so it does not look cut off on the sides but looks full width. . .

Right now – I set everyting I know how to 100% and not “contained” and still can’t figure out how to get the very top header where the logo is installed to look 100% without margins on the left and right. . . please see here http://www.milliondollaroriginator.com/ thank you

[Leo]

Can you open a new topic for your question?

Thanks!

[Author]

Posts