Topic: How do I get a banner image at the top and make the board 800px wide?

http://www.yourmomatron.com/christ/

I want a banner at the top that is 800 pixels wide, and I want the boards to be even with the banner. How can I do both of those? Thank you.

Re: How do I get a banner image at the top and make the board 800px wide?

Add the banner in include/template/main.tpl. The board width can be adjusted in section 5.1 of the CSS file (e.g. Oxygen.css).

"Programming is like sex: one mistake and you have to support it for the rest of your life."

Re: How do I get a banner image at the top and make the board 800px wide?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html dir="<pun_content_direction>">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<pun_char_encoding>" />
<pun_head>
</head>
<body>

<div id="punwrap">
<div id="pun<pun_page>" class="pun">

<div id="brdheader" class="block">
    <div class="box">
        <div id="brdtitle" class="inbox">
            <pun_title>
            <pun_desc>
        </div>
        <pun_navlinks>
        <pun_status>
    </div>
</div>

<pun_announcement>

<pun_main>

<pun_footer>

</div>
</div>

</body>
</html>


That is the text in "main.tpl"

The url to the banner is yourmomatron.com/cb.gif

How do it edit main.tpl to have the banner show up?

Re: How do I get a banner image at the top and make the board 800px wide?

Just insert e.g. <img src="http://yourmomatron.com/cb.gif" alt="Banner!!!" /> somewhere. If you want it at the top of the page, you can do it above the board header (the div with id="brdheader").

"Programming is like sex: one mistake and you have to support it for the rest of your life."

5

Re: How do I get a banner image at the top and make the board 800px wide?

It is working good for the banner, thankks a lot.
I would like to have the main page at 650 px like the banner, where do i write that in the code:

/* 5.1 Page margins */

HTML, BODY {MARGIN: 0; PADDING: 0}
#punwrap {margin:12px 20px}

Thanks Pun
my forums

Re: How do I get a banner image at the top and make the board 800px wide?

Wild guess:

HTML, BODY {MARGIN: 0; PADDING: 0}
#punwrap {width: 650px}

"Programming is like sex: one mistake and you have to support it for the rest of your life."

7

Re: How do I get a banner image at the top and make the board 800px wide?

And will this work if i want to center the all pages:

#punwrap {width: 650px; center}

Otherwise, what do i need ?

Thanks Pun
my forums

Re: How do I get a banner image at the top and make the board 800px wide?

sif wrote:

And will this work if i want to center the all pages:

#punwrap {width: 650px; center}

Otherwise, what do i need ?

Centering with CSS can be done in 2 ways. The first (this one is neat and is valid CSS but won't work in IE < 6):

#punwrap {
width: 650px;
margin-left: auto;
margin-right: auto;
}


2nd way of centering:

#punwrap {
position: relative;
left: 50%;
top: 12px;
width: 650px;
margin-left: -325px;
}

9

Re: How do I get a banner image at the top and make the board 800px wide?

Many thanks, Sanders.

I will try by my own to put a background image as in the main page (doesn' t work in IE...), and to link the banner to the main page as well.
Again, thanks a lot

Sif

Thanks Pun
my forums