How to stop banner from extending too far to the right at different resolutions

I've had no luck getting a fix for this at the Invision forum, so I'm going to try my luck here.

I was testing out my forum at different resolutions and was disappointed to find that the banner/logo sticks out to the right in everything except a resolution of 1152 x 864.

This is what I get at most resolutions.



This is what I want in all resolutions.



According to the boffins at Invision, I won't be able to achieve the effect I want unless I resize the banner/logo. But isn't there a way to code it so that it simply stretches and contracts when necessary, just as the body of the forum does?

Many thanks!

P.S. I'm not permitted to post a link to my forum at this stage; however, you'll find it at: thechristianidentityforum dot net slash testaroonie

 

This is probably because your logo is 1021px wide. If you use code to stretch the image according to the resolution, it will appear stretched and ugly.

One easy solution might be placing this CSS in your relevant template file:

div#header{background-color:#000; text-align:center;}

Code (markup):

It makes the header have a black background and brings the image to the center, and since your image is dark, it will appear like it has stretched throughout.

This is a quick fix solution though, if you post your template file here, maybe someone can help you do it better...

 

Thanks for that fast reply.

I'll give your suggestion a try.

This is the template that contains the relevant code.

 

I fixed the problem. I chopped about a third off the right-side of the image, then added a black background, as adityamenon suggested, and that was it.

 

Cheers! Glad to know you could figure it out