Full-width logo image in header

[Lastufka]

I have my site set up in Layout and Design at 1200px max width with a site width of 80%. So far so good.

I’d like to use a full-width banner image in the header for the logo, the image is 2400px wide so it scales to 1200px for retina.

But the image is being constrained by the 80% site width (it’s not filling the entire header).

What CSS can I use to tell the header image to ignore the site width of 80% and instead display the header image at 100% width?

Thanks.

[ruenel]

Hello There,

Thanks for writing in! Please go to X > Theme Options > Header > Logo And Navigation and set the layout as Stacked. You can then use this custom css:

.x-logobar .x-container.max.width {
    width: 100%;
    max-width: 1200px;
}

We would loved to know if this has work for you. Thank you.