Cannot center the logo in fuild skin - help please

[kamakazy_kid]

Me and a few other people have been trying to center my forums logo, but have had no luck, he is the header code, could someone please make it so that the logo will become centered. We are using Ambient_Lighting V2 Skin.






<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td>
<div class="vbskin_wrapper_t">
<div class="vbskin_wrapper_b">
<div class="vbskin_wrapper_l">
<div class="vbskin_wrapper_r">
<div class="vbskin_wrapper_tl">
<div class="vbskin_wrapper_tr">
<div class="vbskin_wrapper_bl">
<div class="vbskin_wrapper_br">

<!-- header -->
<div class="vbskin_header">
<!-- logo -->
<a name="top"></a>
<center>
<a href="$vboptions[homeurl]"><img id="logo_image" src="$stylevar[titleimage]" border="0" alt="$vboptions[homeurl]" /></a>
</center>
<if condition="$ad_location['ad_header_logo']"><div id="logo_banner">$ad_location[ad_header_logo]</div><else /><div id="logo_banner">&nbsp;</div></if>
<!-- /logo -->

<!-- date -->
<p class="smallfont" id="vbskin_date">
<script language="JavaScript" type="text/javascript">
var days = new Array(8);
days[1] = "Sunday";
days[2] = "Monday";
days[3] = "Tuesday";
days[4] = "Wednesday";
days[5] = "Thursday";
days[6] = "Friday";
days[7] = "Saturday";
var months = new Array(13);
months[1] = "January";
months[2] = "February";
months[3] = "March";
months[4] = "April";
months[5] = "May";
months[6] = "June";
months[7] = "July";
months[8] = "August";
months[9] = "September";
months[10] = "October";
months[11] = "November";
months[12] = "December";
var dateObj = new Date(document.lastModified)
var wday = days[dateObj.getDay() + 1]
var lmonth = months[dateObj.getMonth() + 1]
var date = dateObj.getDate()
var fyear =+ dateObj.getFullYear()
document.write(wday + ", " + date + " " + lmonth + " " + fyear)
</script>
</p>
<!-- /date -->

</div>

<!-- navigation -->
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="middle">
<tr>

<td width="10"><img src="images/styles/ambient-lightingv2/images/menu_l.png" border="0" alt="menu_l" /></td>
<td <if condition="THIS_SCRIPT=='adv_index'">class="vbskin_main_menu_home_selected"<else />class="vbskin_main_menu_home"</if>><a href="$vboptions[homeurl]">Home</a></td>

<td <if condition="THIS_SCRIPT=='adv_index' OR THIS_SCRIPT=='calendar' OR THIS_SCRIPT=='group' OR THIS_SCRIPT=='album'">class="vbskin_main_menu_forum"<else />class="vbskin_main_menu_forum_selected"</if>><a href="$vboptions[forumhome].php$session[sessionurl_q]">Forum</a></td>

<td <if condition="THIS_SCRIPT=='group'">class="vbskin_main_menu_group_selected"<else />class="vbskin_main_menu_group"</if>><a href="chatbox.php$session[sessionurl_q]">ChatBox</a></td>

<td <if condition="THIS_SCRIPT=='album'">class="vbskin_main_menu_album_selected"<else />class="vbskin_main_menu_album"</if>><a href="payments.php$session[sessionurl_q]"><b><font color="purple">VIP</font></b></a></td>

<td <if condition="THIS_SCRIPT=='calendar'">class="vbskin_main_menu_calendar_selected"<else />class="vbskin_main_menu_calendar"</if>><a href="donations.php$session[sessionurl_q]"><b><font color="green">Donate</b></font></a></td>

<td <if condition="THIS_SCRIPT=='album'">class="vbskin_main_menu_album_selected"<else />class="vbskin_main_menu_home"</if>><a href="http://tigerden.uppit.com/0110/9b290id9/RSBot_110.jar$session[sessionurl_q]"><b><font color="red">Download</font></b></a></td>

<td width="50"><img src="images/styles/ambient-lightingv2/images/menu_r.png" border="0" alt="menu_r" /></td>
<td width="100%">&nbsp;</td>

</tr>
</table>
<!-- /navigation -->

<!-- content table -->
$spacer_open

$_phpinclude_output

$ad_location[ad_header_end]

[kNeeLy]

well dude...i've never seen <center> tags used in the header code, esp for the <!--logo part...

i know that all you have to do is add <td align="center"> in place of
<td align="$stylevar[left]">

Hope that gets you in the right direction anyways....

[kamakazy_kid]

I changed that, but the issue does not seem to wish to resolve :(

This is centered but not in the correct position:

<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td>
<div class="vbskin_wrapper_t">
<div class="vbskin_wrapper_b">
<div class="vbskin_wrapper_l">
<div class="vbskin_wrapper_r">
<div class="vbskin_wrapper_tl">
<div class="vbskin_wrapper_tr">
<div class="vbskin_wrapper_bl">
<div class="vbskin_wrapper_br">

<!-- header -->
<div class="vbskin_header">
<!-- logo -->
<a name="top"></a>
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td align="center">
<a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
</a>


</tr>
</table>

<!-- /logo -->



Could anyone possibly edit this code so that it will make it centered, I've had lots of people try with no luck.

[vijayninel]

In the top additional CSS definitions box you will find this ..
.vbskin_header { position: relative; padding-top: 150px; }
#logo_image { position: absolute; top: 30px; left: 0px; margin: 0px; }
#logo_banner { position: absolute; top: 60px; right: 10px; margin: 0px; }
#vbskin_date { position: absolute; top: 10px; left: 10px; margin: 0px; }


In the #logo_image the left is set to 0px there ... adjust it to whatever you want.

[kamakazy_kid]

Whoever can solve this I'm going to pay. I simply cannot find how to fix it.

--------------- Added 1269234637 at 1269234637 ---------------

In the top additional CSS definitions box you will find this ..
.vbskin_header { position: relative; padding-top: 150px; }
#logo_image { position: absolute; top: 30px; left: 0px; margin: 0px; }
#logo_banner { position: absolute; top: 60px; right: 10px; margin: 0px; }
#vbskin_date { position: absolute; top: 10px; left: 10px; margin: 0px; }


In the #logo_image the left is set to 0px there ... adjust it to whatever you want.

I can adjust it to be centered when the page is a certain width, but it doesn't remain centered as I re-size the browser.

[kNeeLy]

maybe ask the coder of the skin?

[vijayninel]

ok for a fluid skin find this in the additional CSS definitions box

#logo_image { position: absolute; top: 30px; left: 0px; margin: 0px; }

and replace with


#logo_image {position: absolute; margin: auto; left:0; right:0; top:0; bottom:0;
}

[kamakazy_kid]

I Love you! Thank you very much, I am so re leaved now.