Current location: Hot Scripts Forums » General Web Coding » HTML/XHTML/XML » Trouble with positioning naviboard


Trouble with positioning naviboard

Reply
 
LinkBack Thread Tools Display Modes
  #1 (permalink)  
Old 01-11-08, 05:10 AM
BlueDragoness BlueDragoness is offline
Newbie Coder
  
Join Date: Nov 2007
Location: Scotland
Posts: 14
Thanks: 0
Thanked 0 Times in 0 Posts
Trouble with positioning naviboard
Hi. I was wondering if someone could help me out here. You see, I'm trying to get the naviboard to come just after the heading but for some reason the naviboard ends up right at the bottom yet the HTML code clearly states that the Menus are just after the heading. This is the result I keep getting. If someone could at least suggest what the problem is, that be great.


HTML Code:
<head>
  <LINK REL="StyleSheet" HREF="menu.css">
  <script language="javascript" src="menu.js"></script>
</head>

<body>

  <h1 align="center">CSS trail</h1>
<br>


<!-- MAIN MENU START -->
  <table class="navbar" width="800">
    <tr>
      <td class="menuNormal" width="160" onmouseover="expand(this);" 
      onmouseout="collapse(this);">
        <p>menu1</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr>

              <!-- SUBMENU 1 START -->
              <td class="menuNormal" width="154" onmouseover="expand(this);" 
              onmouseout="collapse(this);">Item 1 ...
                <div class="menuNormal" width="150">
                  <table class="menu" width="150">
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 1</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 2</a>
                    </td></tr>
                    <tr>

                    <!-- SUB SUBMENU START -->
                      <td class="menuNormal" width="154" onmouseover="expand(this);" 
                      onmouseout="collapse(this);">Subitem 3 ...
                        <div class="menuNormal" width="150">
                          <table class="menu" width="150">
                            <tr><td class="menuNormal">
                              <a href="page.htm" class="menuitem">Subitem 1</a>
                            </td></tr>
                            <tr><td class="menuNormal">
                              <a href="page.htm" class="menuitem">Subitem 2</a>
                            </td></tr>
                            <tr><td class="menuNormal">
                              <a href="page.htm" class="menuitem">Subitem 3</a>
                            </td></tr>
                            <tr><td class="menuNormal">
                              <a href="page.htm" class="menuitem">Subitem 4</a>
                            </td></tr>
                            <tr><td class="menuNormal">
                              <a href="page.htm" class="menuitem">Subitem 5</a>
                            </td></tr>
                          </table>
                        </div>
                      </td>
                    <!-- SUB SUBMENU END -->

                    </tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 4</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 5</a>
                    </td></tr>
                  </table>
                </div>
              </td>
              <!-- SUBMENU 1 END -->

            </tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 2</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 3</a>
            </td></tr>
            <tr>

              <!-- SUBMENU 2 START -->
              <td class="menuNormal" width="154" onmouseover="expand(this);" 
              onmouseout="collapse(this);">Item 4 ...
                <div class="menuNormal" width="150">
                  <table class="menu" width="150">
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 1</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 2</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 3</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 4</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 5</a>
                    </td></tr>
                  </table>
                </div>
              </td>
              <!-- SUBMENU 2 END -->

            </tr>
          </table>
        </div>
      </td>
      <!-- MENU 1 END -->

      <!-- MENU 2 START -->
      <td class="menuNormal" width="160" onmouseover="expand(this);" 
      onmouseout="collapse(this);">
        <p>menu2</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 1</a>
            </td></tr>
            <tr>

              <!-- SUBMENU 3 START -->
              <td class="menuNormal" width="154" onmouseover="expand(this);" 
              onmouseout="collapse(this);">Item 2 ...
                <div class="menuNormal" width="150">
                  <table class="menu" width="150">
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 1</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 2</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 3</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 4</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 5</a>
                    </td></tr>
                  </table>
                </div>
              </td>
              <!-- SUBMENU 3 END -->

            </tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 3</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 4</a>
            </td></tr>
          </table>
        </div>
      </td>
      <!-- MENU 2 END -->

      <!-- MENU 3 START -->
      <td class="menuNormal" width="160" onmouseover="expand(this);" 
      onmouseout="collapse(this);">
        <p>menu3</p>
        <div class="menuNormal" width="155">
          <table width="155" class="menu">
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 1</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 2</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 3</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 4</a>
            </td></tr>
          </table>
        </div>
      </td>
      <!-- MENU 3 END -->

      <!-- MENU 4 START -->
      <td class="menuNormal" width="160" onmouseover="expand(this);" 
      onmouseout="collapse(this);">
        <p>menu4</p>
        <div class="menuNormal" width="155">
          <table width="155" class="menu">
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 1</a>
            </td></tr>
            <tr>

              <!-- SUBMENU 4 START -->
              <td class="menuNormal" width="154" onmouseover="expand(this);" 
              onmouseout="collapse(this);">Item 2 ...
                <div class="menuNormal" width="150">
                  <table class="menu" width="150">
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 1</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 2</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 3</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 4</a>
                    </td></tr>
                    <tr><td class="menuNormal">
                      <a href="page.htm" class="menuitem">Subitem 5</a>
                    </td></tr>
                  </table>
                </div>
              </td>
              <!-- SUBMENU 4 END -->

            </tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 3</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 4</a>
            </td></tr>
          </table>
        </div>
      </td>
      <!-- MENU 4 END -->

      <!-- MENU 5 START -->
      <td class="menuNormal" width="160" onmouseover="expand(this);" 
      onmouseout="collapse(this);">
        <p>menu5</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 1</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 2</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 3</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 4</a>
            </td></tr>
          </table>
        </div>
      </td>
      <!-- MENU 5 END -->

  <!-- MENU 6 START -->
      <td class="menuNormal" width="160" onmouseover="expand(this);" 
      onmouseout="collapse(this);">
        <p>menu6</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 1</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 2</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 3</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 4</a>
            </td></tr>
          </table>
        </div>
      </td>
      <!-- MENU 6 END -->
  <!-- MENU 7 START -->
      <td class="menuNormal" width="160" onmouseover="expand(this);" 
      onmouseout="collapse(this);">
        <p>menu7</p>
        <div class="menuNormal" width="155">
          <table class="menu" width="155">
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 1</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 2</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 3</a>
            </td></tr>
            <tr><td class="menuNormal">
              <a href="page.htm" class="menuitem">Item 4</a>
            </td></tr>
          </table>
        </div>
      </td>
      <!-- MENU 7 END -->
  <!-- MAIN MENU END -->
<hr>

<br>
<br>
<br>
<p class="double">
Hello! I'm Pyro girl and this is my CSS trial web page! I've basically
just learnt CSS off w3schools tutorial site and this is me just trying it out
now. Now I've added a wee naviboard but I'm have a spot of bother with it just now as it should be at the top of the page but I'll see what I can do with it.</p>
<br>
<br>
</body>
</html>
Reply With Quote
  #2 (permalink)  
Old 01-12-08, 06:42 AM
BlueDragoness BlueDragoness is offline
Newbie Coder
  
Join Date: Nov 2007
Location: Scotland
Posts: 14
Thanks: 0
Thanked 0 Times in 0 Posts
Nevermind, I managed to re-write the code and managed to fix the problem
Reply With Quote
Reply

Bookmarks

« Floating Feature on site | Can I use comments out side of the HTML? »

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes
Linear Mode Linear Mode

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On
Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
AJAX Post an Array trouble scott2500uk JavaScript 9 11-30-09 10:39 AM
Trouble understanding "for" statements Akacae Windows .NET Programming 3 08-09-07 10:20 AM
Positioning in CSS zoliky CSS 1 01-11-07 07:18 AM
NEED help with positioning iframes or table on my page please help thanks cgrossi04 HTML/XHTML/XML 4 09-03-04 08:54 PM
trouble in PhpBB ^sam^ PHP 2 05-09-04 03:34 PM


All times are GMT -5. The time now is 09:01 PM.
vBulletin® Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.