Really annoying template problems - racking my brain out

[blueuniverse]

Ok, I'm working on the new design for my forums on a test board so I can't give you the link or everything - it being password protected and all. Anyway, I've added a navigation bar (with images) to the header to replace the existing one below. The problem results with vbulletin somehow (this is where I've been racking my brains out - I can't see where) putting in cellspacing 1 between them all.

Now, I know there is the stylevars variable set as 1 by default but I've tried this hundreds of times, setting it to 0 and even to 10 to see if it had any effect. I then set it to 0 in the header but still this gap of 1 persists on showing up, throwing off my whole design.

I'm sure I'm missing something here but I just can't see what. I've included a screenshot (with the table cell edges highlighted) for assistance and the code in my header (it is definitely not the code elsewhere - worked that out already).

<div id="GALBox"
style="position: absolute; z-index: 100;
visibility: hidden;"
onmouseover="this.style.visibility='visible';"
onmouseout="this.style.visibility='hidden';">
</div>
<!-- logo -->
<a name="top"></a>
<table width="$stylevar[outertablewidth]" cellspacing="0" cellpadding="0" align="center" class="maintable">
<tr><td width="100%">
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td width="288" rowspan="2" valign="top" align="$stylevar[left]"><a href="$vboptions[forumhome].php?$session[sessionurl]"><img src="$stylevar[titleimage]" alt="$vboptions[bbtitle]" width="288" height="78" border="0" /></a></td>
<td height="49" colspan="7" valign="top">&nbsp;</td>
</tr>
<tr>
<td width="52" height="29" valign="top"><a href="$vboptions[forumhome].php?$session[sessionurl]" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','images/v4/misc/homeroll.gif',1)"><img src="images/v4/misc/home.gif" alt="Home" name="Home" width="52" height="29" border="0" id="Home" /></a></td>
<td width="60" valign="top"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Forums','','images/v4/misc/forumsroll.gif',1)"><img src="images/v4/misc/forums.gif" alt="Forums" name="Forums" width="60" height="29" border="0" id="Forums" /></a></td>
<if condition="$show['registerbutton']"><td width="68" valign="top">
<a href="register.php?$session[sessionurl]" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Register','','images/v4/misc/registeroll.gif',1)"><img src="images/v4/misc/register.gif" alt="$vbphrase[register]" name="Register" width="68" height="29" border="0" id="Register" /></a></td> </if>
<if condition="$bbuserinfo['userid']"><td width="68" valign="top">
<a href="login.php?$session[sessionurl]do=logout&amp;u=$bbuserinfo[userid]" onclick="return log_out()" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('logout','','images/v4/misc/logoutroll.gif',1)">
<img src="images/v4/misc/logout.gif" alt="Log Out" name="logout" width="68" height="29" border="0" id="logout" /></a></td></if>
<td width="59" valign="top"><a href="usercp.php?$session[sessionurl]" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Usercp','','images/v4/misc/usercproll.gif',1)"><img src="images/v4/misc/usercp.gif" alt="User Cp" name="Usercp" width="59" height="29" border="0" id="Usercp" /></a></td>
<td width="67" valign="top" id="interactive"><a href="#interactive" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('interactive','','images/v4/misc/interactiveroll.gif',1)"><img src="images/v4/misc/interactive.gif" alt="interactive" name="interactive" width="67" height="29" border="0" id="interactive" /><script type="text/javascript"> vbmenu_register("interactive", 1); </script>
</a></td>
<td width="61" valign="top" id="navbar_search"><a href="search.php?$session[sessionurl]" accesskey="4" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('search','','images/v4/misc/searchroll.gif',1)"><img src="images/v4/misc/search.gif" alt="search" name="search" width="61" height="29" border="0" id="search" /><script type="text/javascript"> vbmenu_register("navbar_search", 1); </script>
</a></td>
<td width="73" valign="top" id="usercptools"><a href="#usercptools" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Quick Links','','images/v4/misc/quicklinksroll.gif',1)"><img src="images/v4/misc/quicklinks.gif" alt="Quick Links" name="Quick Links" width="73" height="29" border="0" id="Quick Links" /><script type="text/javascript"> vbmenu_register("usercptools", 1); </script>
</a></td>
</tr>
</table>
<!-- /logo -->



$spacer_open

$_phpinclude_output

It's pretty messy code, but just to give you a basic understanding - each td is a different image and the images are all rollovers hence all the code.

I'm sure it is something simple I'm missing but for the life of me I can't find out what.

Thanks in advance,

Ed

[Princeton]

TIPS

1)__ if you are going to use that code change your doctype to HTML
2)__ ids should be unique -- eg. you have 2 id='interactive'
3)__ have you checked your button images for any padding (white space)?
4)__ you should use an IF/ELSE for your Register/LOGOUT buttons
5)__ try adding CSS to your table -- border-collapse: collapse; (http://www.w3schools.com/css/pr_tab_border-collapse.asp)
6)__ if the table cells do not add up to the outer table width ... add an empty cell to push the other cells together (same row)

[blueuniverse]

Ok, just going through those.

1. How come? It should all be xhtml compatible.
2. Need 2 interactive ids so the link can be attributed to the image and the rollover can work.
3. There is white space around them, although not as much as is there. It was designed within Photoshop to fit perfectly in the size space with the images tightly packed together on the top table.
4. Didn't realise this in the code. What else could would I put to show the register button if the user was logged out?
5. Tried but didn't work :(
6. Table cells add up :S

[blueuniverse]

Any ideas anybody?

[blueuniverse]

What's equally weird, and something which draws me to thinking that it's a vbulletin related problem is that reducing the size of the images and the table cells they're in seems to have no effect on the positioning at all. :S

This isn't a matter of not clearing the cache before you ask either. It's just a bit confusing.