Can't distribute navbar buttons evenly

[afmarko99]

My site was hacked a week or so ago. I have completed a fresh install of 3.7.6 Patch Level 2 and a fresh install of my sql database. I have edited my navbar template using some of the php from an old navbar doc I saved and some from the 'view source' feature of my google cached website.

My original site's navbar buttons were centered and distributed evenly across the entire navbar.

See google cache version of my site from Oct 7 here:
http://webcache.googleusercontent.com/search?q=cache:IvI15MvjAfYJ:www.thepublicenemy.net/member.php%3Fu%3D1+site:thepublicenemy

Here is the current version (Problem) of my site:
www.thepublicenemy.net (http://www.thepublicenemy.net)


<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td><img src="images/styles/rirrakusu/style/navbar_left.gif" alt="" border="0" /></td>
<td width="100%" class="top_navbar">

<table align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="top_navbar_button"><a href="$vboptions[bburl]/index.php">Home</a></td>
<td class="top_navbar_button"><a href="$vboptions[bburl]/forum.php">Forum</a></td>
<if condition="$show['guest']">
<td class="top_navbar_button"><a href="register.php$session[sessionurl_q]">$vbphrase[register]</a></td></if>
<td class="top_navbar_button"><a href="">Roster</a></td>
<td class="top_navbar_button"><a href="memberlist.php$session[sessionurl_q]">Members</a></td>
<td class="top_navbar_button"><a href="search.php$session[sessionurl_q]">$vbphrase[search]</a></td>
<td class="top_navbar_button"><a href="$vboptions[contactuslink]" rel="nofollow">$vbphrase[contact_us]</a></td>

<if condition="$show['member']">
<td class="top_navbar_button"><a href="usercp.php$session[sessionurl_q]">$vbphrase[user_cp]</a></td>

<td class="top_navbar_button">
<if condition="!$show['guest']">
<!-- member logout -->
<a href="login.php?$session[sessionurl]do=logout&amp;logouthash=$bbuserinfo[logouthash]" onclick="return log_out('$vbphrase[sure_you_want_to_log_out]')"><phrase 1="$bbuserinfo[username]">Log Out</phrase></a> <!-- end member logout -->
</if></td></if>
</tr>
</table>
</td>
<td><img src="images/styles/rirrakusu/style/navbar_right.gif" alt="" border="0" /></td>
</tr>
</table>

I have it the same and can't figure out what the problem is. My old site was running vbulletin 3.6.4.

[nerbert]

I take it you mean you want the black buttons to be spread out?

I think you want to leave cellpadding and cellspacing unspecified in your table tag and they should distribute evenly.

[afmarko99]

Yes, I want to spread them out evenly.

[nerbert]

Here's more trouble:



.top_navbar_button
{
font: bold 11px arial, verdana, geneva, lucida, 'lucida grande', helvetica, sans-serif;
color: #ECECEC;
background: #080808 url(images/styles/rirrakusu/style/navbar_button_bg.gif) no-repeat top left;
width: 79px;
text-align: center;
padding: 3px 0px 3px 0px;
margin-right: 1px;
}


This forces all the table cells to be only 79px wide but their widths should all be some percent of the total depending on how many there are. I would try doing it like this:

<td><div class="top_navbar_button"><a href="$vboptions[bburl]/index.php">Home</a></div></td>

This may also work:

<td> <a href="$vboptions[bburl]/index.php" class="top_navbar_button">Home</a></td>

--------------- Added 1319173275 at 1319173275 ---------------

That second suggestion won't work, never mind that. If using a div tag works you'll have to change the background spec so it reads "center" at the end instead of "left".

Hope that works. I'm off to bed, will check later.

[afmarko99]

That didn't make a difference. It almost seems like 3.7 is ignoring the configuration for this navbar.

[nerbert]

Well, it's getting better. Change the background spec to "center" instead of "left" at the end of the line. There's still a problem with black in between the buttons.

--------------- Added 1319215854 at 1319215854 ---------------

This might do it:

.top_navbar_button
{
font: bold 11px arial, verdana, geneva, lucida, 'lucida grande', helvetica, sans-serif;
color: #ECECEC;
background: url(images/styles/rirrakusu/style/navbar_button_bg.gif) no-repeat top center;
width: 79px;
text-align: center;
padding: 3px 0px 3px 0px;
margin-right: 1px;
}
.top_navbar_button a:link, .top_navbar_button a:visited
{
background-color:#0808080;
color: #ECECEC;
text-decoration: none;
}
.top_navbar_button a:hover, .top_navbar_button a:active
{
background-color:#080808;
color: #669966;
text-decoration: none;
}

[afmarko99]

Yea, I changed something earlier as I was troubleshooting trying to figure out how to get it to work. Then my site was hacked and this time they changed my admin username and pass. I'm working to try and fix that issue first.

I take it 3.7.2 is not a good version to be running?

[nerbert]

Yikes! I know 3.7.2 is no longer supported. I don't know if there are any special security issues with it. Good luck.

[Lynne]

It's not looking the same because you don't have as many buttons there. They are all spreading out to take up the 1024px you have set aside for it. If you reduce that to... 700px, then it will look like the old one (the navbar will, but it has other affects). Add back all your buttons and then see what it is like.

[nerbert]

He wants them spread out. Right now (aside from being hacked) he needs to center the images so they line up with the text and get rid of the black background color so he doesn't have the black rectangles between the images.

[afmarko99]

I think Lynne may have been right. I thought my first go around I had inserted the coding into frontpage and then used frontpage's option to 'distribute evenly'. Then took that html and used it for my site.

Maybe it was just a matter of adding more buttons which I just did. Thanks for the help nerbert and Lynne. I will just leave it the way it is now with more buttons added.