Results 1 to 2 of 2

Thread: Website Navigation Problem

  1. #1
    umarkal Guest

    Website Navigation Problem

    Hello

    I have a problem with my navigation. Well everything is working and there is a gap between the Navigation bar and the body.

    My HTML and CSS coding are shown below:

    ---HTML---

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
    <title>Ready Made Custom PCS</title>
    <link rel="stylesheet" href="custombuild.css" type="text/css" />
    </head>
    <body>

    <center>
    <table width="50%">

    <tr><td>
    <!--header-->
    <div id="header">

    <!--logo-->
    <div id="logo">
    <img src="images/logo.png" width="270px" alt=""></img>
    </div>

    <!--email-->
    <div id="email">
    <a href="mailto:muk0261@my.londonmet.ac.uk"><img src="images/email.png" border="0px"></a>
    </div>

    </td></tr>

    <!--navigation-->
    <tr><td>
    <img src="images/navbar.gif"></img>

    <div id="navigation">
    <ul>
    <li><a href="index.html">Home </a></li>
    <li><a href="product.html">Products</a></li>
    <li><a href="service.html">Services</a></li>
    <li><a href="about.html">About Us</a></li>
    <li><a href="contact.html">Contact</a></li>
    </ul>
    </div>

    </td></tr>


    <!--body-->
    <tr><td>

    <div id="content">
    Text Goes Here. Text Goes Here. Text Goes Here. Text Goes Here. Text Goes Here.
    Text Goes Here. Text Goes Here. Text Goes Here. Text Goes Here. Text Goes Here.
    Text Goes Here. Text Goes Here. Text Goes Here. Text Goes Here. Text Goes Here.
    Text Goes Here. Text Goes Here. Text Goes Here. Text Goes Here. Text Goes Here.
    </div>

    </td></tr>

    <!--footer-->
    <tr><td>
    <div id="footer">

    <!--copyright-->
    <center>
    <div id="copyright">
    Powered by Mohammed Kaleem - Copyright &copy;&nbsp;2011 - All Rights Reserved &reg;
    </div>

    </center>
    </td></tr>

    </table>
    </center>
    </body>
    </html>

    ---CSS---

    body {
    font-family:arial;
    font-size: 12px;
    margin: 5px;
    background-image:url('images/backgroundbottom.png');
    background-repeat:repeat-x;
    background-position:center bottom;
    }

    table {
    background-color: white;
    border-left: 8px ridge black;
    border-right: 8px ridge black;
    border: 0px soild #cccccc;
    }

    #header {
    background-color: #000000;
    height: 150px;
    width: 100%;
    }

    #logo {
    margin: 25px;
    position: absolute; top: -500; left: 335;
    }

    #email {
    position: relative; top: 80px; left: 310px;
    }

    #navigation {list-style: none;}
    #navigation {font-size: 16px;}
    #navigation li {display: inline; padding: 50px;}
    #navigation li a:hover {color: blue;}
    #navigation li a {color: black;}
    #navigation {position: relative; left:-10px; top:-50px;}
    #navigation ul li a:visited, a:hover{text-decoration: none;}

    #body{
    border: 1px solid black;
    height: 405px;
    width: 100%;
    }

    #content{
    border: 1px solid black;
    height: 1000px;
    width: 100%;
    }

    #footer{
    background-color: #000000;
    height: 50px;
    width: 100%;
    }

    #copyright {font-size: 12; color: white;}
    #copyright {position: relative; bottom:-20px;}

    To view a live website of the problem i have above, please go to www.custombuild.com.nu

  2. #2
    Join Date
    Aug 2009
    Posts
    193
    [comment deleted]
    Last edited by zachsformacs95; 06 Apr 2018 at 07:09 PM.

Similar Threads

  1. Problem with navigation position
    By sasho90 in forum Web Design, HTML Reference and CSS
    Replies: 0
    Last Post: 12 Apr 2010, 10:12 AM
  2. IE 6 Navigation Problem: Rocking Chair
    By mikewgd in forum Website Design Reviews
    Replies: 0
    Last Post: 18 Feb 2009, 10:18 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •