MyBB Community Forums

Hi, so is there any way to make a continuous header made up of three separate images? What i mean is, using this as the centre image


followed by this on the left and right.



I'd need the images to repeat themselves to cover the entirety of the sides of the page, so that, if someone were to view the page on a large screen the header would continue across the entire screen.

Instead of this


It'd be


Please and thank you's

Try this

Go to ACP > Templates & Style > Themes > Your Theme > global.css > Edit Stylesheet: Advanced Mode

Add to bottom:

.header_background
{
background-image: url(http://i.imgur.com/P66kRb5.gif);
background-repeat:repeat-x;
height:331px;
}

.header_logo
{
width:1032px;
margin:0 auto;
}

Save changes.

On the left sidebar click Templates > Your Theme > Header > header (or wherever you added it before)

Add/Change to:

<div class="header_background"><img src="http://i.imgur.com/VuiW1qp.gif" class="header_logo"></div>

That should work.

That's just a solid color, right? Then you don't need a separate class for it, nor another image. Just set your header to a min-width of 100% and add a background color to it.

Example:

.header {
    background-image: url(http://i.imgur.com/VuiW1qp.gif);
    background-repeat: no-repeat;
    background-color: #e63754;
    height: 331px;
    min-width: 100%;
    margin: auto;
}