Announcement

Collapse
No announcement yet.

Header aligned to the left, main forum centered

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • #16
    It was copied exactly from the other script

    I will have a look though, I was thinking something else in vb was changing the alignment. I had to change the main forum width, so thought something else had to be changed for the header.
    John Diver

    Comment


    • #17
      It was NOT copied exactly. Here is a portion of the code, which includes the working parts of the navigation section that looks the way you want it to:
      Code:
      <body>
      <div id="topbar_box">
      <div id="topbar">
      <table width="100%" height="50" cellpadding="0" cellspacing="0"><tr>
      
      <td width="150" valign="bottom">
      <a href="Http://www.NorthWestSocial.com"><img src="Http://www.NorthWestSocial.com/themes/blue/logo.jpg" /><img src="Http://www.NorthWestSocial.com/themes/blue/logo2.png" /></a>
      </td>
      <td>
      	<table  cellpadding="0" cellspacing="0">
      	<form action="Http://www.NorthWestSocial.com/index.php?p=search/listing" method="post" name="search_form">
      	<tr>
      	<td valign="top">
      	<input type="text" id="search_box" name="title" value="" name="search_box"  />
      	</td>
      	<td>
      
      	<input type="submit" value="find" id="search_button" style="display:none" />
      	</td>
      	<td>
      	<input type="image" src="Http://www.NorthWestSocial.com/themes/blue/search.jpg" />
      	</tr>
      	</form>
      	</table>
      </td>
      
      	<td align="center"><a href="Http://www.NorthWestSocial.com/index.php?p=member/login">Login</a> | <strong><a href="Http://www.NorthWestSocial.com/index.php?p=member/signup">Signup</a></strong>
      
      	</td></tr>
      </table><br>
      <table style="width: 100%;">
        <tbody>
          <tr>
            <td align="center" width="65px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/home.png" /></td>
            <td align="center" width="50px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/browse.jpg" /></td>
            <td align="center" width="100px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/directory.jpg" /></td>
            <td align="center" width="40px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/forum.png" /></td>
            <td align="center" width="65px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/games.gif" /></td>
      
            <td align="center" width="65px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/photos.jpg" /></td>
            <td align="center" width="190px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/restaurants.gif" /></td>
            <td align="center" width="75px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/activities.gif" /></td>
            <td align="center" width="95px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/videos.jpg" /></td><td style="vertical-align: top;"></td>
          </tr>
        </tbody>
      </table>
      <div class="topnav_box">
      <ul class="topnav">
      <li  class="menugen" ><a href="Http://www.NorthWestSocial.com">Home</a></li><li  class="menugen" ><a href="Http://www.NorthWestSocial.com/index.php?p=browse">Browse</a></li><li  class="menugen" ><a href="http://www.northwestsocial.com/directory">Directory</a></li><li  class="menugen" ><a href="http://www.northwestsocial.com/forum/index.php">Forum</a></li><li  class="menugen" ><a href="http://www.northwestsocial.com/forum/arcade.php">Games</a></li><li  class="menugen" ><a href="Http://www.NorthWestSocial.com/index.php?p=photos">Photos</a></li><li  class="menugen" ><a href="Http://www.NorthWestSocial.com/index.php?p=test">Restaurants / Takeaways</a></li><li  class="menugen" ><a href="Http://www.NorthWestSocial.com/index.php?p=Attractions">Things To Do</a></li><li  class="menugen" ><a href="Http://www.NorthWestSocial.com/index.php?p=videos">Videos</a></li></ul>
      
      </div>
      
      
      </div>
      </div>
      Here is the same portion of the code on your forum home page - the one the navigation section doesn't look the way you want it to:
      Code:
      <body>
      <!--logo-->
      <a name="top"></a>
      <table width="982px" cellspacing="0" align="center" cellpadding="0" border="0">
        <tbody>
      
          <tr>
            <td align="left"><a href="index.php"><img border="0" src="http://www.northwestsocial.com/themes/blue/logo.jpg" alt="North West Social Forums" /></a></td>
            <td align="right" id="header_right_cell">
              </td>
          </tr>
        </tbody>
      </table>
      <!--/logo-->
      <br />
      <table align="right" width="982px">
        <tbody>
      
          <tr>
            <td align="center" width="65px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/home.png" /></td>
            <td align="center" width="60px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/browse.jpg" /></td>
            <td align="center" width="100px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/directory.jpg" /></td>
            <td align="center" width="40px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/forum.png" /></td>
            <td align="center" width="75px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/games.gif" /></td>
            <td align="center" width="65px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/photos.jpg" /></td>
            <td align="center" width="170px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/restaurants.gif" /></td>
            <td align="center" width="65px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/activities.gif" /></td>
            <td align="center" width="65px"><img height="25" width="25" border="0px" alt="" title="" src="/themes/blue/menu/videos.jpg" /></td><td style="vertical-align: top;"></td>
      
          </tr>
        </tbody>
      </table><br><br><br>
      <div class="topnav_box" align="center">
      <ul class="topnav">
      <li class="menuon"><a href="Http://www.NorthWestSocial.com">Home</a></li><li class="menugen"><a href="Http://www.NorthWestSocial.com/index.php?p=browse">Browse</a></li><li class="menugen"><a href="http://www.northwestsocial.com/directory">Directory</a></li><li class="menugen"><a href="http://www.northwestsocial.com/forum/index.php">Forum</a></li><li class="menugen"><a href="http://www.northwestsocial.com/forum/arcade.php">Games</a></li><li class="menugen"><a href="Http://www.NorthWestSocial.com/index.php?p=photos">Photos</a></li><li class="menugen"><a href="Http://www.NorthWestSocial.com/index.php?p=test">Restaurants / Takeaways</a></li><li class="menugen"><a href="Http://www.NorthWestSocial.com/index.php?p=Attractions">Things To Do</a></li><li class="menugen"><a href="Http://www.NorthWestSocial.com/index.php?p=videos">Videos</a></li></ul>
      
      </div>
      Not even CLOSE to being the same.

      Even the good page has a lot of errors, but at least it looks the way you want. The errors can be fixed after you get the copy and paste right. Unfortunately, you also have to contend with vBulletin templates and the original code started out being valid. Try working with a clean style (make a child style of the default and work with that until you get it right).

      You said you weren't a coder, but you want to deal with xHTML and CSS. You are going to have trouble until you can learn to take these things a small step at a time. There's no such thing as instant results when coding. If it were me, I would be tackling the bad code on the pages that look the way I want them to. Then I would try to convert it to code that will work on my vB forum templates.

      Jim
      If my post was helpful to you, please take the time to register at my forum and ask a question you've always wanted to know about floors.
      www.TheFloorPro.com

      Comment


      • #18
        Hey Jim,

        I had the code copied exactly from the other script, I changed it a lot trying to get it working on vbulletin, the code copied exactly from the other scripts gave worse results.

        I am going to copy the code again and put it into the header and start working with it from scratch and hopfully I can find how to work it better!

        Yes your right, Im not a coder and trying to work with this, but I have no option so I am trying my best

        Thank you for taking the time to help me Jim
        John Diver

        Comment


        • #19
          Ahhhhhhhh...I still can't get this fixed.

          Does something change the alignment of the header from the main forum (and footer)?

          I really can't understand why the header is not centered when the rest of the forum is...
          John Diver

          Comment


          • #20
            You don't currently have any centering around your top tables - put a <div align="center">stuff</div> around it like you do with the rest of your site.

            Please don't PM or VM me for support - I only help out in the threads.
            vBulletin Manual & vBulletin 4.0 Code Documentation (API)
            Want help modifying your vbulletin forum? Head on over to vbulletin.org
            If I post CSS and you don't know where it goes, throw it into the additional.css template.

            W3Schools &lt;- awesome site for html/css help

            Comment


            • #21
              Sorry for the very late reply!

              I have tried to put the div center in a number of places but still the icons are totally out of alignment.

              I'm just going to copy/paste the code from another script and try work with that because I have made a lot of changes from it and hopefully the div center will fix this!

              Thanks for the replies and help again
              John Diver

              Comment

              widgetinstance 262 (Related Topics) skipped due to lack of content & hide_module_if_empty option.
              Working...
              X