Topic: Problem centering content
I've just integrated my forum to my web site header using this method :
Adding a SUBST for my web page header (tpd_header.php) to the file 'header.php' of the forum. Modifying the main.tpl file to include the same tpd_header.php file
Everythings seems to work fine! Except I would like to put all the forum content into a 766px invisible box, centered into the web page (auto-margin left and right so resizing the window won't change the centered position), just like my own web site header.
Where and how should I add the code?
Heres my header.php code :
[...]
// START SUBST - <pun_content_direction>
$tpl_main = str_replace('<pun_content_direction>', $lang_common['lang_direction'], $tpl_main);
// END SUBST - <pun_content_direction>
// START SUBST - <pun_char_encoding>
$tpl_main = str_replace('<pun_char_encoding>', $lang_common['lang_encoding'], $tpl_main);
// END SUBST - <pun_char_encoding>
// START SUBST - <pun_head>
ob_start();
// Is this a page that we want search index spiders to index?
if (!defined('PUN_ALLOW_INDEX'))
echo '<meta name="ROBOTS" content="NOINDEX, FOLLOW" />'."\n";
?>
<title><?php echo $page_title ?></title>
<link rel="stylesheet" type="text/css" href="style/<?php echo $pun_user['style'].'.css' ?>" />
<link rel="stylesheet" type="text/css" href="../css/style.css" />
<?php
if (defined('PUN_ADMIN_CONSOLE'))
echo '<link rel="stylesheet" type="text/css" href="style/imports/base_admin.css" />'."\n";
if (isset($required_fields))
{
// Output JavaScript to validate form (make sure required fields are filled out)
?>
<script type="text/javascript">
<!--
function process_form(the_form)
{
var element_names = new Object()
<?php
// Output a JavaScript array with localised field names
while (list($elem_orig, $elem_trans) = @each($required_fields))
echo "\t".'element_names["'.$elem_orig.'"] = "'.addslashes(str_replace(' ', ' ', $elem_trans)).'"'."\n";
?>
if (document.all || document.getElementById)
{
for (i = 0; i < the_form.length; ++i)
{
var elem = the_form.elements[i]
if (elem.name && elem.name.substring(0, 4) == "req_")
{
if (elem.type && (elem.type=="text" || elem.type=="textarea" || elem.type=="password" || elem.type=="file") && elem.value=='')
{
alert("\"" + element_names[elem.name] + "\" <?php echo $lang_common['required field'] ?>")
elem.focus()
return false
}
}
}
}
return true
}
// -->
</script>
<?php
}
$user_agent = isset($_SERVER['HTTP_USER_AGENT']) ? strtolower($_SERVER['HTTP_USER_AGENT']) : '';
if (strpos($user_agent, 'msie') !== false && strpos($user_agent, 'windows') !== false && strpos($user_agent, 'opera') === false)
echo '<script type="text/javascript" src="style/imports/minmax.js"></script>';
$tpl_temp = trim(ob_get_contents());
$tpl_main = str_replace('<pun_head>', $tpl_temp, $tpl_main);
ob_end_clean();
// END SUBST - <pun_head>
// START SUBST - <tpd_header>
$tpl_temp = file_get_contents('tpd_header_forum.php');
$tpl_main = str_replace('<tpd_header>', $tpl_temp, $tpl_main);
// END SUBST - <tpd_header>
// START SUBST - <body>
if (isset($focus_element))
{
$tpl_main = str_replace('<body onload="', '<body onload="document.getElementById(\''.$focus_element[0].'\').'.$focus_element[1].'.focus();', $tpl_main);
$tpl_main = str_replace('<body>', '<body onload="document.getElementById(\''.$focus_element[0].'\').'.$focus_element[1].'.focus()">', $tpl_main);
}
// END SUBST - <body>
// START SUBST - <pun_page>
$tpl_main = str_replace('<pun_page>', basename($_SERVER['PHP_SELF'], '.php'), $tpl_main);
// END SUBST - <pun_title>
// START SUBST - <pun_title>
$tpl_main = str_replace('<pun_title>', '<h1><span>'.pun_htmlspecialchars($pun_config['o_board_title']).'</span></h1>', $tpl_main);
// END SUBST - <pun_title>
[...]
And here is my tpd_header.php code
<div id="header">
> WELCOME TO <strong><span class="blink">BONUSMONITOR.COM</span></strong> : THE POKER <strong>DEALS LISTING</strong> AUTHORITY <
</div>
<div id="header_shd"><img src="img/header_cshd.gif" alt=""
width="766" height="5" class="header_cshd"/>
</div>
<div id="top">
<div id="conteneur_top">
<div id="logo_tpd"><a id="linkhome" href="../index.php"><img src="../img/logo_tpd.gif" alt=""
width="312" height="50" class="logo_tpd"/></a>
</div>
<div id="adserver">
<a href="http://www.fulltiltpoker.com/?key=MDAwMDE3QjEwMDAwMDAwMDIwNDA4MDIyMDAwMDAwMDA-" target="_blank" >
<img src="../img/date_ca.gif" class="gen">
<!-- <a href="http://www.fulltiltpoker.com/?key=MDAwMDE3QjEwMDAwMDAwMDIwNDA4MDIyMDAwMDAwMDA-" target="_blank" >
<img src="img/fulltilt_top.gif" alt="100% bonus with all the pros" class="gen">
</a>-->
</div>
<div id="links">
<a id="fdeals" href="#" ><span class="alt">Free Deals List</span></a>
<img src="../img/link_symbol.gif" alt="" class="gen_link"/>
<a id="blist" href="#" ><span class="alt">Bonus List</span></a>
<img src="../img/link_symbol.gif" alt="" class="gen_link"/>
<a id="rlist" href="#" ><span class="alt">Rakeback List</span></a>
<img src="../img/link_symbol.gif" alt="" class="gen_link"/>
<a id="rinfos" href="#" ><span class="alt">Room infos</span></a>
<a href="#" ><img src="../img/postadeal.gif" alt="" class="gen_link"/></a>
<a id="forums" href="index.php" ><span class="alt">Forums</span></a>
</div>
</div>
<div id="underlinks"><img src="../img/underlinks.gif" alt="" class="underlinks"/>
</div>
</div>
My website CSS include this so the content is well centered :
#conteneur_top
{
width: 764px;
margin-left: auto;
margin-right: auto;
height: 80px;
border-left: solid black 1px;
border-right: solid black 1px;
}
Thanks in advance for your help!