Topic: how do i...

get http://www.christopher-powell.co.uk/forum/forums.php to match http://www.christopher-powell.co.uk/ (template wise) you know like use the width of my website to match the width of the forum. As at the moment the forum looks like a wide skin. I'd like them to match

Any help would be much appreciated!

Cheers

Chris

Re: how do i...

http://punbb.org/forums/viewtopic.php?id=6456

~James
FluxBB - Less is more

Re: how do i...

cheers

i just want to have the forums central (everything for the forums central) like my website http://www.christopher-powell.co.uk/


how do i do this. i didn't design my website so i can't compare. so if was told what i needed to do in the forums side of things to match them up to the website i could though (or at least try) it would look a lot better central cool

4 (edited by Dr.Jeckyl 2007-03-14 18:23)

Re: how do i...

follow the directions in the link i posted and it will make your forums centered and a fixed width. 800px is i think what the example is.

or use this. replace the same section of your cp.css file with this one:

/****************************************************************/
/* 5. VERTICAL AND PAGE SPACING */
/****************************************************************/

/* 5.1 Page margins */

BODY {text-align: center; background: #4A4451 url(http://www.christopher-powell.co.uk/img/bg.jpg) repeat-y center top;}
#punwrap {width: 700px; margin: 12px auto; text-align:left}

/* 5.2 Creates vertical space between main board elements (Margins) */

DIV.blocktable, DIV.block, DIV.blockform, DIV.block2col, #postreview {MARGIN-BOTTOM: 12px}
#punindex DIV.blocktable, DIV.blockpost {MARGIN-BOTTOM: 6px}
DIV.block2col DIV.blockform, DIV.block2col DIV.block {MARGIN-BOTTOM: 0px}

/* 5.3 Remove space above breadcrumbs, postlinks and pagelinks with a negative top margin */

DIV.linkst, DIV.linksb {MARGIN-TOP: -12px}
DIV.postlinksb {MARGIN-TOP: -6px}

/* 5.4 Put a 12px gap above the board information box in index because the category tables only
have a 6px space beneath them */

#brdstats {MARGIN-TOP: 12px}

i'm sure it's not up to standard but it's functional.

~James
FluxBB - Less is more

Re: how do i...

Quality! http://www.christopher-powell.co.uk/forums/forums.php it worked and everything seems to showing ok. I just replaced the css file with your code.

I?ve got a backup of my original css file so alls good in case i want to change it back.

Much appreciated James!

Cheers

Chris

Re: how do i...

Chris Powell wrote:

I just replaced the css file with your code.

COOL! i edited my post to show the section to replace/edit. glad it works.

~James
FluxBB - Less is more

Re: how do i...

Defo. Thanks.

Re: how do i...

chris try this...
what im trying to do is make the pun nav bar look like the nav bar on the main site.

copy the nav css to the main.tpl
put it in the style format

<style>
ur nav code
</style>


<div id="nav">
 <pun_navlinks>
</div>

just an idea!

Q

My stuff or my style might sux, but atleast I'm willing to help when I can.
Don't be stupid and help ! We are the stupid one's !!!

9 (edited by pogenwurst 2007-03-23 21:19)

Re: how do i...

that would look a lot better for sure

there's load of coding in the site_style sheet. not sure what i'm meant to do exactly as i'm not very good when it comes to web design etc

thanks for your reply quaker

/*
Christopher-powell.co.uk web site style sheet
Created by Karl Schaap http://www.reasonfreak.co.uk
March 13th 2007


Background and website font */
body {
    margin: 0px;
    padding: 0px;
    font: 0.8em/150% Tahoma, Verdana, Arial, sans-serif;
    text-align: center; /* IE fix */
    background: #4A4451 url(/img/bg.jpg) repeat-y center top;
}
/* page container */
div#container {
    width: 700px;
    margin: 0px auto; /* IE fix */
    padding: 0px;
    text-align: left; /*IE fix */
    background: #FFFFFF;
}
/* page titles */
h1,h2,h3 {
    font-weight: normal;
    margin-top: 0px;
    padding: 0px;
    margin-bottom: 0.8em;
}
/* logo area */
div#header {
    margin: 0px;
    padding: 0px;
    height: 145px;
    background: url(/img/logo.jpg) no-repeat center top;
}
/* website title - hidden when CSS enabled */
div#header h1,div#header h2 {
    display: none;
}
/* navigation container */
div#nav {
    margin: 0px;
    padding: 0px 0px 0px 3px;
    border-bottom: 1px solid #999999;
    border-top: 1px solid #999999;
    height: 1.8em;
    text-align: center;
}
/* navigtion unordered list */
div#nav ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}
/* navigation list items */
div#nav ul li {
    margin: 0px;
    padding: 0px;
    float: left;
}
/* navigation links (normal state) */
div#nav ul li a {
    margin: 0px;
    padding: 0px;
    display: block;
    width: 9.01em;
    text-align: center;
    text-decoration: none;
    line-height: 1.8em;
    height: 1.8em;
    border-right: 1px solid #999999;
    background: url(/img/nav_n.jpg) repeat-x left center;
    color: #FFFFFF;
    font-weight: bold;
}
/* navigation links (mouse over) */
div#nav ul li a:hover {
    background: #21262A;
}
/* highlights current page in navigation bar */
div#nav #current a {
    color: #FFFFFF;
    background: #21262A;
}
/* page content area */
div#content {
    margin: 0px;
    padding: 20px;
    clear: both; /* IE Fix */
}
/* page content titles and text */
div#content h2, div#content h3,div#content p {
    padding-bottom: 20px;
    margin-top: 0px;
    padding-top: 0px;
    margin-bottom: 0px;
}
/* page titles */
div#content h2 {
    font-size: 180%;
}
/* news title */
div#content h3 {
    font-size: 150%;
}
/* horizontal rule separator */
div#content hr {
    margin-bottom: 20px;
    color: #999999;
    background: #999999;
    height: 1px;
}
/* copyright info area */
div#footer {
    margin: 0px 20px;
    padding: 0px;
    text-align: center;
    height: 6em;
    font-size: 90%;
    border-top: 1px solid #999999;
}
/* copyright info text */
div#footer p {
    margin: 0px;
    padding-top: 2.5em;
}
/* all links */
a {
    color: #0000CC;
}
/* all links (on mouse over) */
a:hover {
    text-decoration: none;
}
/* form container */
form#contactform {
    margin: 0px;
    padding: 0px;
    border: 1px solid #D6D6D6;
    width: 450px;
}
/* textfields */
input, textarea {
    padding-left: 3px;
    font-weight: bold;
}
/* submit button */
.sbut {
    border: 2px solid #009933;
    background: #FFFFFF;
    margin: 0px;
    padding: 0.3em;
}
/* links list */
div#content ul {
    margin-top: 0px;
    list-style: none;
    margin-left: 0px;
    padding: 0px;
}
/* table borders */
#edittable th,#edittable td {
    border: 1px solid #999999;
    padding: 0.8em;
}

10

Re: how do i...

chris you can take this an dput it in ur main.tpl
at the top and see how it does...
remember to change the locations of the img files
and u can only put the style needed for this in there.

<div id="header">
<h1><a href="/">Christopher-Powell.co.uk</a></h1>
<h2>Trance DJ from Birmingham, England</h2>
</div><div id="nav">
<ul>
<li id="current"><a href="/" title="Home page">Home</a></li>
<li><a href="/forums/forums.php" title="Christopher Powell Online Forums">Forums</a></li>
<li><a href="/mixes.php" title="My mixes">Mixes</a></li>
<li><a href="/links.php" title="My favourite links">Links</a></li>
<li><a href="/contact.php" title="Contact me">Contact Me</a></li>
<li><a href="/admin/main.php" style="border-right: medium none;" title="Admin">Admin</a></li>
</ul>
</div>
My stuff or my style might sux, but atleast I'm willing to help when I can.
Don't be stupid and help ! We are the stupid one's !!!

11 (edited by pogenwurst 2007-03-23 21:19)

Re: how do i...

at the moment this is what i have in the main.tpl (includes/forums)

<!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>

i really have no idea what to do quaker
thanks for your help...

Re: how do i...

I think he means it like this:

<!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>
        <div id="header">
<h1><a href="/">Christopher-Powell.co.uk</a></h1>
<h2>Trance DJ from Birmingham, England</h2>
</div><div id="nav">
<ul>
<li id="current"><a href="/" title="Home page">Home</a></li>
<li><a href="/forums/forums.php" title="Christopher Powell Online Forums">Forums</a></li>
<li><a href="/mixes.php" title="My mixes">Mixes</a></li>
<li><a href="/links.php" title="My favourite links">Links</a></li>
<li><a href="/contact.php" title="Contact me">Contact Me</a></li>
<li><a href="/admin/main.php" style="border-right: medium none;" title="Admin">Admin</a></li>
</ul>
</div>
        <pun_status>
    </div>
</div>

<pun_announcement>

<pun_main>

<pun_footer>

</div>
</div>

</body>
</html>

In other words, he simply wanted you to replace pun_navlinks with the code he gave you.

FluxBB - v1.4.8