MyBB Community Forums

Full Version: Forum Header Help Please
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
This is what I'm seeing:

I have tried wider images, no luck.
Can anyone help?
So, just make the image wider?
Anyone?
You are using a screen width MUCH wider than I have. That is why I never saw the edge of that huge page background image. (BTW, that huge background slows down your page loading)

Make an image using a full height vertical slice of the background image in your .logo class. (use just a narrow part)

In your CSS put

#header {BACKGROUND: url(path-to-image) repeat-x; }

Currently none of your 3 stylesheets has header ID (that I could find).

That background will fill the width of the page and the .logo class background will be on top of the repeating filler. This is a piece of the HTML your page delivers now so you can see the .logo class will sit on top of the header ID.

<div id="header">
	<div class="logo">
(2009-05-17, 02:08 AM)Gene_RI Wrote: [ -> ]You are using a screen width MUCH wider than I have. That is why I never saw the edge of that huge page background image. (BTW, that huge background slows down your page loading)

Make an image using a full height vertical slice of the background image in your .logo class. (use just a narrow part)

In your CSS put

#header {BACKGROUND: url(path-to-image) repeat-x; }

Currently none of your 3 stylesheets has header ID (that I could find).

That background will fill the width of the page and the .logo class background will be on top of the repeating filler. This is a piece of the HTML your page delivers now so you can see the .logo class will sit on top of the header ID.

<div id="header">
	<div class="logo">
So, where should I insert that slice of CSS? Do I need to put the HTML somewhere, also?
No you don't need to create any HTML. Just create an image that is a piece of the image you use now as a background in .logo, upload it somewhere, then put:

#header {BACKGROUND: url(path-to-image) repeat-x; }

in your stylesheet substituting path-to-image with the location of where you uploaded the image.
You do realize that he/she will lose his/her image on the right if he/she does that, right?
(2009-05-18, 02:41 AM)Scoutie44 Wrote: [ -> ]You do realize that he/she will lose his/her image on the right if he/she does that, right?
No the background image on the right is in the logo class which will be on top of the #header (.logo loads after #header). I use the same trick on my forum where I have a header background centered then an image on top of that on one side that I set as a background on top of the other background then centered text that I don't want pushed to the side by the image. When you resize the browser window the text will slide right over the image I put on the side and that image is on top of the biger background.
It worked. Thank you for all of your help.
Never mind. I didn't realize the images were piled on top of each other.
Pages: 1 2