Announcement

Collapse
No announcement yet.

header div problem

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

  • header div problem

    Hi,

    I'm running a skin on my forum and am having a problem with the header. If you look at http://www.ps3-leagues.co.uk/forum/ you will be able to scroll to the right which should not be happening. For some reason the header background image is continuing on a bit.

    I thought the header div width would be causing the problem but now im not sure. The top of the site is made of 3 separate images. The background image which stretches the whole way across, the logo is an image floated to the left and again another image which is floated to the right which gives the effect of a rectangular box. If the image which is floated to the right is stopping where it should be i dont understand why the background image continues to stretch.

    Here is the header code:



    <a name="top"></a>

    <table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
    <tr>
    <td align="$stylevar[left]">

    <div class="header">

    <div class="navigation">
    <a href="../forum/$session[sessionurl_q]">PS3 FORUM</a> &nbsp;&nbsp;
    <if condition="$show['member']"><span id="usercptools"><a href="$show[nojs_link]#usercptools" rel="nofollow">QUICKLINKS</a>
    <script type="text/javascript"> vbmenu_register("usercptools", true); </script></span> &nbsp;&nbsp; </if>
    <a href="usercp.php$session[sessionurl_q]" rel="nofollow">USER CP</a> &nbsp; &nbsp;
    <a href="memberlist.php$session[sessionurl_q]" rel="nofollow">MEMBERS</a> &nbsp;&nbsp;
    <if condition="$show['registerbutton']"><a href="register.php$session[sessionurl_q]" rel="nofollow">REGISTER</a> &nbsp;&nbsp;</if>
    <a href="search.php$session[sessionurl_q]" rel="nofollow">SEARCH</a> &nbsp; &nbsp;
    <a href="search.php?do=getnew$session[sessionurl_q]" rel="nofollow">NEW POSTS</a>&nbsp;&nbsp;
    <a href="arcade.php?$session[sessionurl_q]">ARCADE</a>
    </div>
    <img class="floatright" src="images/styles/soness/style/ps3_logo_2.jpg" alt="">
    </div>
    </div>

    <br />

    <!-- content table -->
    <div align="center">
    <div style="width:$stylevar[outerdivwidth]; text-align:$stylevar[left]">
    <div class="page" style="margin: 0px $stylevar[spacersize]px 0px $stylevar[spacersize]px; padding:5px">
    <div><span style="float:right"><img class="page_corner_tr" src="images/styles/soness/style/page_corner_tr.gif" alt="" border="0" /></span><img class="page_corner_tl" src="images/styles/soness/style/page_corner_tl.gif" alt="" border="0" /></div>

    $_phpinclude_output

    <!-- Left Column Code -->
    <table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
    <tr>
    <td width="200" valign="top" align="left">$leftcolumn</td>
    <td valign="top">
    <table width="100%" cellpadding="0" cellspacing="0" border="0" align="right">
    <tr>
    <td valign="top">
    <!-- End Left Column Code -->







    and the css layout code is:

    .header
    {

    background-image: url(images/styles/soness/style/ps3_logo.jpg);
    background-repeat: no-repeat; background-position: top left;
    height: 150px;

    }

    .floatright
    {
    float:right;
    height: 150px;
    }


    .logo
    {
    padding: 16px 40px 20px 40px;
    }

    .navigation
    {
    width: 100%;
    position: absolute;
    top: 17px; left: 90px;

    }





    Can anyone see where im going wrong?

    Thanks

  • #2
    It is clearly a layout problem of some kind, but I am unable to find the exact cause. If no one else here is able to help you then I recommend you either contact the author of the style or post on www.vbulletin.org.

    Comment


    • #3
      If you put this in the html tag, it is easier to see that your div tags do not add up. You've got two div start tags right under the "<td align="$stylevar[left]">" tag and then three div end tags right before the "<br />" tag. I'd suggest putting the template into an html editor and matching tags.
      HTML Code:
      <a name="top"></a>
      
      <table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
      <tr>
          <td align="$stylevar[left]">
      
      <div class="header">
          
          <div class="navigation">
              <a href="../forum/$session[sessionurl_q]">PS3 FORUM</a> &nbsp;&nbsp;
      <if condition="$show['member']"><span id="usercptools"><a href="$show[nojs_link]#usercptools" rel="nofollow">QUICKLINKS</a>
      <script type="text/javascript"> vbmenu_register("usercptools", true); </script></span> &nbsp;&nbsp; </if>
              <a href="usercp.php$session[sessionurl_q]" rel="nofollow">USER CP</a> &nbsp; &nbsp;
              <a href="memberlist.php$session[sessionurl_q]" rel="nofollow">MEMBERS</a> &nbsp;&nbsp; 
      <if condition="$show['registerbutton']"><a href="register.php$session[sessionurl_q]" rel="nofollow">REGISTER</a> &nbsp;&nbsp;</if>
              <a href="search.php$session[sessionurl_q]" rel="nofollow">SEARCH</a> &nbsp; &nbsp;
              <a href="search.php?do=getnew$session[sessionurl_q]" rel="nofollow">NEW POSTS</a>&nbsp;&nbsp;
              <a href="arcade.php?$session[sessionurl_q]">ARCADE</a>
      </div>
      <img class="floatright" src="images/styles/soness/style/ps3_logo_2.jpg" alt="">
      </div>
      </div>
      
      <br />
      
      <!-- content table -->
      <div align="center">
          <div style="width:$stylevar[outerdivwidth]; text-align:$stylevar[left]">
              <div class="page" style="margin: 0px $stylevar[spacersize]px 0px $stylevar[spacersize]px; padding:5px">
      <div><span style="float:right"><img class="page_corner_tr" src="images/styles/soness/style/page_corner_tr.gif" alt="" border="0" /></span><img class="page_corner_tl" src="images/styles/soness/style/page_corner_tl.gif" alt="" border="0" /></div>
      
      $_phpinclude_output
      
      <!-- Left Column Code  -->
      <table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
      <tr>
      <td width="200" valign="top" align="left">$leftcolumn</td>
      <td valign="top">
      <table width="100%" cellpadding="0" cellspacing="0" border="0" align="right">
      <tr>
      <td valign="top">
      <!-- End Left Column Code -->

      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


      • #4
        I don't think it's a header problem. Header code looks good. Try to search a navbar template...

        Comment

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