vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vB3 Programming Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=15)
-   -   [Help] Nav Bar Centering (https://vborg.vbsupport.ru/showthread.php?t=208953)

metalguitarist3 03-20-2009 10:27 PM
[Help] Nav Bar Centering
 
Hi.

We are completely new users to vBulletin, and have to say we're liking what we see.

We are trying to center the part of our forums where it says "Homepage" , "Your Account" etc

We can move the header image so that it is centered but cant for the life of us figure out how to move the nav bar links.

Have tried adding <center> tags pretty much everywhere in the header but to no avail.

Any ideas?

Our header looks like this:

Quote:
<!-- logo -->
<a name="top"></a>
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><img src="$stylevar[imgdir_misc]/logo.gif" border="0" alt="" /></td>
<td align="$stylevar[right]" id="header_right_cell">
<if condition="$ad_location['ad_header_logo']">$ad_location[ad_header_logo]<else />&nbsp;</if>
</td>
</tr>
</table>
<!-- /logo -->

<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><a href="index.php"><img src="$stylevar[imgdir_misc]/homepage_nav.gif" border="0" alt="" /></a></td>
<if condition="$show['member']">
<td><a href="usercp.php"><img src="$stylevar[imgdir_misc]/youraccount_nav.gif" border="0" alt="" /></a></td>
</if>
<td><a href="memberlist.php"><img src="$stylevar[imgdir_misc]/memberlist_nav.gif" border="0" alt="" /></a></td>
<td><a href="calendar.php"><img src="$stylevar[imgdir_misc]/calendar_nav.gif" border="0" alt="" /></a></td>
<td><a href="search.php"><img src="$stylevar[imgdir_misc]/search_nav.gif" border="0" alt="" /></a></td>
<td id="usercptools"><a href="$show[nojs_link]#usercptools"><img src="$stylevar[imgdir_misc]/quicklinks_nav.gif" border="0" alt="" /></a><script type="text/javascript"> vbmenu_register("usercptools",true); </script></td>
<td><a href="faq.php"><img src="$stylevar[imgdir_misc]/faq_nav.gif" border="0" alt="" /></a></td>
<td width="100%"></td>
</tr>
</table>

<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><img src="$stylevar[imgdir_misc]/extralinks.gif" border="0" alt="" /></td>
<td width="100%" style="padding-left:10px;">
<a href="#" class="sublink">Link Here</a>
<a href="#" class="sublink">Link Here</a>
<a href="#" class="sublink">Link Here</a>
<a href="#" class="sublink">Link Here</a>
<a href="#" class="sublink">Link Here</a>
</td>
</tr>
</table>

<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><img src="$stylevar[imgdir_misc]/top-left.gif" border="0" alt="" /></td>
<td width="100%" style="background-image:url('blueevolution/misc/top-bg.gif'); background-repeat:repeat-x;"></td>
<td><img src="$stylevar[imgdir_misc]/top-right.gif" border="0" alt="" /></td>
</tr>
</table>

<!-- content table -->
$spacer_open

$_phpinclude_output
$ad_location[ad_header_end]
Thanks in advace.

tipoboy 03-20-2009 10:29 PM
could you provide a link

metalguitarist3 03-21-2009 07:38 AM
sorry, my bad.

Mr-Moo 03-21-2009 04:05 PM
What happens when you try to put:

Code:
<td align="center">

Seven Skins 03-21-2009 05:33 PM
HTML Code:
<!-- logo -->
<a name="top"></a>
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><img src="$stylevar[imgdir_misc]/logo.gif" border="0" alt="" /></td>
<td align="$stylevar[right]" id="header_right_cell">
<if condition="$ad_location['ad_header_logo']">$ad_location[ad_header_logo]<else />&nbsp;</if>
</td>
</tr>
</table>
<!-- /logo -->

<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td width="50%">&nbsp;</td>
<td><a href="index.php"><img src="$stylevar[imgdir_misc]/homepage_nav.gif" border="0" alt="" /></a></td>
<if condition="$show['member']">
<td><a href="usercp.php"><img src="$stylevar[imgdir_misc]/youraccount_nav.gif" border="0" alt="" /></a></td>
</if>
<td><a href="memberlist.php"><img src="$stylevar[imgdir_misc]/memberlist_nav.gif" border="0" alt="" /></a></td>
<td><a href="calendar.php"><img src="$stylevar[imgdir_misc]/calendar_nav.gif" border="0" alt="" /></a></td>
<td><a href="search.php"><img src="$stylevar[imgdir_misc]/search_nav.gif" border="0" alt="" /></a></td>
<td id="usercptools"><a href="$show[nojs_link]#usercptools"><img src="$stylevar[imgdir_misc]/quicklinks_nav.gif" border="0" alt="" /></a><script type="text/javascript"> vbmenu_register("usercptools",true); </script></td>
<td><a href="faq.php"><img src="$stylevar[imgdir_misc]/faq_nav.gif" border="0" alt="" /></a></td>
<td width="50%">&nbsp;</td>
</tr>
</table>

<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><img src="$stylevar[imgdir_misc]/extralinks.gif" border="0" alt="" /></td>
<td width="100%" style="padding-left:10px;">
<a href="#" class="sublink">Link Here</a>
<a href="#" class="sublink">Link Here</a>
<a href="#" class="sublink">Link Here</a>
<a href="#" class="sublink">Link Here</a>
<a href="#" class="sublink">Link Here</a>
</td>
</tr>
</table>

<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td><img src="$stylevar[imgdir_misc]/top-left.gif" border="0" alt="" /></td>
<td width="100%" style="background-image:url('blueevolution/misc/top-bg.gif'); background-repeat:repeat-x;"></td>
<td><img src="$stylevar[imgdir_misc]/top-right.gif" border="0" alt="" /></td>
</tr>
</table>

<!-- content table -->
$spacer_open

$_phpinclude_output
$ad_location[ad_header_end]

Try this, it should work.

metalguitarist3 03-21-2009 06:04 PM
Seven_Skins: That worked great thanks very much.

Next question is the header image, how would i go about making it the width of the screen?

Thanks in advance again.

Mr-Moo 03-21-2009 06:38 PM
I see what you did Seven, you added an extra TD in there and it shoved the data over, but in my eyes is that the 'proper' method in doing this? I am curious why none of the aligns properly function, could it be a CSS conflict?

I'm just curious :p

As for your question metalguitarist, you need to have an image the proper length to span across the page, but to size it properly, please revise your code to the following:

PHP Code:
<!-- logo -->
<a name="top"></a>
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
<tr>
<td width="100%"><img src="$stylevar[imgdir_misc]/logo.gif" border="0" alt="Logo" width="100%" height="300" /></td>
<td align="$stylevar[right]" id="header_right_cell">
<if condition="$ad_location['ad_header_logo']">$ad_location[ad_header_logo]<else />&nbsp;</if>
</td>
</tr>
</table>
<!-- /logo --> 
This will make the Cell that the logo is in, and the logo 100% width of the Table. However, please keep in mind, your table width for that is determined by "$stylevar[outertablewidth]". If you want that to also span across your full page, change that to 100% also. Please keep in mind though, this may alter the display of the page since I have not looked at the CSS.

Test it out, let us know what it looks like.

Seven Skins 03-21-2009 06:44 PM
Quote:
Originally Posted by Mr-Moo (Post 1773602)
I see what you did Seven, you added an extra TD in there and it shoved the data over, but in my eyes is that the 'proper' method in doing this? I am curious why none of the aligns properly function, could it be a CSS conflict?

I'm just curious :p

There was a TD at the end with width=100% ... hence none of the center tag worked.
So amde another TD in front with 50% width and reduced the width of end TD to 50%.

.

Mr-Moo 03-21-2009 07:01 PM
Excellent, thank you Seven,

I appreciate you taking the time out to explain that to me. I will keep my eyes peeled for that in my own code in the future.

metalguitarist3 03-22-2009 01:27 AM
Hi guys. Just tested it our and it works great thanks very much. Put a temporary header in just now so theres something to look at lol. Obviously need to make it bigger in photoshop to get rid of those rough edges, but thats easy enough.

Thanks again.


All times are GMT. The time now is 05:28 AM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01024 seconds
  • Memory Usage 1,775KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)bbcode_code_printable
  • (1)bbcode_html_printable
  • (1)bbcode_php_printable
  • (2)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 
Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 
Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete