Part of my menu's are being chopped off.

Discussion in 'HTML & Website Design' started by jmcc1982, Nov 2, 2009.

  1. #1
    Hi

    I am trying to convert a standard menu to a dropdown menu but I did something wrong, because it looks bad.

    To the right of the menu item there is no space, it looks chopped off. there is also no spacing between the items. My sub menus are aligned right and do not sit underneath the main items.

    I'm kinda lost here.

    Any help would be appreciated.

    Here the CSS:

    #nav, #dropdown {
    margin:0;
    padding:0 0 0 32px;
    list-style:none;
    overflow:hidden;
    background:#fff url(button1.gif);
    border:1px solid #000;
    border-width:0 1px;
    border-bottom:1px solid #444;
    }

    #nav li {
    float:left;
    }
    #nav li a{
    display:block;
    height:35px;
    line-height:35px;
    color:#DAE0F1;
    text-decoration:none;
    font-size:11px;
    font-family:arial, verdana, sans-serif;
    font-weight:bold;
    text-align:left;
    padding:0 0 0 8px;
    cursor:pointer;
    }
    #nav li a:hover {
    color:#FFF;
    text-decoration:none;
    background:#000 url(button2.gif);
    }
    #nav li a:hover b {
    background:url(button2.gif) no-repeat right top;
    }
    #dropdown {
    position:absolute;
    display:none;
    z-index:50;
    background:#fff url(button1.gif);
    }
    #dropdown li {
    float:none;
    }
    dropdown li a {
    color:#000;
    }
    #itemtwo:hover #dropdown {
    display:block;
    background-position:left;
    }
    #nav li.current a:hover {
    color:#fff;
    background:#000 url(button3.gif);
    cursor:default;
    }
    #nav li.current a:hover b {
    background:url(button3.gif) no-repeat right top;
    }

    #nav li.current a {
    color:#fff;
    background:url(button3.gif);
    }
    #nav li.current a b {
    background:url(button3.gif) no-repeat right top;
    }


    And heres the HTML:


    <ul id="nav">
    <li><a href="index.php">Home</a></li>
    <li id="itemtwo"><a href="seller_map.php">Property wanted</a>
    <ul id="dropdown">
    <li><a href="seller_map.php">Gauteng</a></li>
    <li><a href="seller_map.php">Western Cape</a></li>
    <li><a href="seller_map.php">KwaZulu Natal</a></li>
    </ul>
    </li>
    <li><a href="buyer_map.php">Property for sale</a></li>
    <li><a href="account_home.php">My Account</a></li>
    <li><a href="bond.php">Need a Bond</a></li>
    <li><a href="investments.htm">Property Investments</a></li>
    <li><a href="process.html">Process</a></li>
    <li><a href="about.html">About Us</a></li>
    <li><a href="contact.php">Contact</a></li>
    </ul>

    Jay
     
    jmcc1982, Nov 2, 2009 IP
  2. jmcc1982

    jmcc1982 Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    thanks but i decided to work around it
     
    jmcc1982, Nov 2, 2009 IP