working with body and header

[Staxed]

this is what i currently have in the admincp style settings for the page body

#ffffff url(images/styles/Irisfire/misc/irisfirelogo.jpg) fixed no-repeat;

I have it working the way i want, except for one small detail, i would like to make the header not move with the rest of the page. How can I get the header to be located above the page body? (i.e...so it doesn't scroll with the forumhome display)

[Staxed]

just a little more info since i didn't explain that very well...

number 1 is what it looks like on opening the page
number 2 is what it looks like when you scroll
number 3 is what i want it to look like when you scroll

[Staxed]

anyone?

[Staxed]

no ones got a clue how to do this at all?

[Staxed]

still need an answer to this

You want everything but the header to scroll? You'd have to stick everything but the header in a frameset, or get slick with DHTML.

[Behemoth]

Originally Posted by Chris-777

You want everything but the header to scroll? You'd have to stick everything but the header in a frameset, or get slick with DHTML.

Actually, it can be done without those, with some tricky coding.

Go to All Style Options for your template.

Ok, first off, keep what you have in the background box. (Assuming that is placed in Body -> Background; if not, move it there.)

Now, in the header box at the top, add above all the code:

<div id="outertable">

Now in the footer box, you should see code similar to:

	$vboptions[copyrighttext]
	</div>
</div>

Below that, add a

</div>

Now, go just under the footer box, and set your Main Table Width to 100% and your Spacer Size to 0.

At the very bottom, in one of your Additional CSS Definitions boxes, add something similar to:

#outertable {
	width: [what you want width as]; /* Set this to what you had Main Table Width as before */
	padding: [what you want padding as]; /* Set this to what you had Spacer Size as before */
        height: [height you want it to cover]%; /* Set this to the size of the page you want it to take up.  Must be a percent!! (can be 100)*/
        position: absolute; /* Just keep this */
        top: [(100% - height)/2] /* Needed to pad the top of it from the top of the screen */
        left: [((100% - width)/2) (unless your forum is fixed width, in which case it is slightly trickier.  Just tell me if your forum is fixed)] /* Needed to pad the left of the box from the left of the screen. */
        overflow: auto; /* Just keep this.  Makes scrollbar(s).*/
}

Also, you should probably delete the comments from the CSS (The text enclosed in /* */ tags).

Just ask for more help if you need any. I'll subscribe to this thread.

[Staxed]

hmm..that didn't seem to work at all...would you be willing to take a look at it for me?