header question?

[oldfan]

When I was on larger screen laptop, my header looked/fit ok.
Now Im on a smaller laptop, I have some over hang see picture.
How can I get it to fit on all screens perfectly with no over/under lap?

thanks

[glennrocksvb]

You have to actually have a wider banner image. On my laptop, it looks like this.


You can stretch the image to fit the available space but it will not look good.

[oldfan]

You have to actually have a wider banner image. On my laptop, it looks like this.


You can stretch the image to fit the available space but it will not look good.

No code or anything to fix that

[oldfan]

I think I got it..
Can you go over and take another picture please

[glennrocksvb]

Still the same. The banner has dimensions of 1284px x 150px. The banner width should be at least 1920px for those larger monitors with 1920 screen resolution.

And to make the banner always extend up to available width regardless of the screen resolution and browser window size, you need to add this custom CSS code in additional.css template:

#header .logo-image,
#header .logo-image img {
    width: 100%;
    max-width: 100%;
}

[oldfan]

Still the same. The banner has dimensions of 1284px x 150px. The banner width should be at least 1920px for those larger monitors with 1920 screen resolution.

And to make the banner always extend up to available width regardless of the screen resolution and browser window size, you need to add this custom CSS code in additional.css template:

#header .logo-image,
#header .logo-image img {
width: 100%;
max-width: 100%;
}

ok tried that thanks.
Is it better now lol

[glennrocksvb]

Yeah it's better that the banner now extends to the available space but it's a little stretched on my 1920 monitor. You didn't make a new banner with a higher quality 1920 wide image as I suggested. It's good enough but it could be better.

[oldfan]

Thanks dude, yes I do need a new banner but I have no art skills lol. I'm strictly a cut and paste dude lmao.