Hello everyone,

I'm having trouble with a unordered list menu.  When you hover over the
link, the drop down works fine except that it is positioned at 0,0 relative
to the div instead of relative to the li (ie: directly underneath where I'm
hovering).  I'm not sure what I'm doing wrong.  Unfortunately the site isn't
live anywhere but here's the code I have.  Maybe someone hopefully can spot
my mistake!

*CSS*

#navbar {
    background: #000000;
    width: 960px;
    height: 29px;
    font-size: 11px;
    font-family: Arial, Tahoma, Verdana;
    color: #FFFFFF;
    font-weight: bold;
    margin: 0px auto 0px;
    padding: 0px 0px 0px 0px;
    border-top: 1px solid #333333;
    border-bottom: 1px solid #333333;
    overflow: hidden;
    }

#navbar a, #navbar a:visited {
    color: #FFFFFF;
    font-size: 11px;
    text-decoration: none;
    text-transform: uppercase;
    padding: 0px 0px 0px 3px;
    }

#navbar a:hover {
    color: #FFFFFF;
    text-decoration: underline;
    }

#navbar p {
    color: #FFFFFF;
    margin: 0px auto 0px;
    padding: 0px 0px 0px 10px;
    font-weight: bold;
    }

#navbarright a img {
    border: none;
    margin: 0px;
    padding: 0px;
    }

#navbarleft {
    width: 680px;
    float: left;
    margin: 0px;
    padding: 8px 0px 8px 0px;
    }

#navbarright {
    width: 240px;
    font-size: 11px;
    float: right;
    margin: 0px;
    padding: 3px 10px 6px 0px;
    text-align: right;
    }

#navbar ul {
    margin: 0px;
    padding: 0px 0px 0px 0px;
    }

#navbar li {
    display: inline;
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    }

#navbar ul li a, #navbar ul li a:visited {
    background: #222222;
    font-size: 11px;
    font-family: Arial, Tahoma, Verdana;
    color: #FFFFFF;
    margin: 0px -3px 0px 0px;
    padding: 7px 14px 6px 12px;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
    border-left: 1px solid #000000;
    }

#navbar ul li a:hover {
    background: #333333;
    color: #FFFFFF;
    margin: 0px -3px 0px 0px;
    padding: 7px 14px 6px 12px;
    text-decoration: none;
    }

.current_page_item a, .current_page_item a:hover {
    background: #FFFFFF !important;
    color: #2255AA !important;
    }

/* Marty's Playground */

#navbar ul li ul {
    display: none;
    }

#navbar ul li ul li {
    float: none;
    }

#navbar ul li ul li a {
    padding: 0;
    margin: 0;
    }

#navbar ul li:hover ul {
    display: block;
    position: absolute;
    left: auto;
    top: auto;
    padding-top: 5px;
    }

#navbar ul li:hover ul li a {
    display: block;
    width: 10em;
    border: none;
    padding: 2px;
    }

*HTML*

<div id="navbar">

        <div id="navbarleft">
        <ul>
                <li class="page_item page-item-3"><a
href="http://osadvantage.com/about-us/"; title="About us">About us</a>
                <ul>
                    <li class="page_item page-item-4"><a
href="http://osadvantage.com/about-us/ira-kaufman/"; title="Ira
Kaufman">Ira Kaufman</a></li>
                </ul>
       </li>
<li class="page_item page-item-5"><a
href="http://osadvantage.com/online-advantage/"; title="Our
Advantage">Our Advantage</a>
        <ul>
        <li class="page_item page-item-15"><a
href="http://osadvantage.com/online-advantage/integrated-marketing-strategy/";
title="Integrated marketing strategy">Integrated marketing
strategy</a></li>
        <li class="page_item page-item-16"><a
href="http://osadvantage.com/online-advantage/what-is-your-brand/";
title="What is your brand?">What is your brand?</a></li>

        <li class="page_item page-item-17"><a
href="http://osadvantage.com/online-advantage/our-rapid-development-delivery-process-rddp/";
title="Our Rapid Development Delivery Process (RDDP)">Our Rapid
Development Delivery Process (RDDP)</a></li>
        <li class="page_item page-item-18"><a
href="http://osadvantage.com/online-advantage/focused-website-strategy/";
title="Focused website strategy">Focused website strategy</a></li>
        <li class="page_item page-item-19"><a
href="http://osadvantage.com/online-advantage/search-engine-optimization/";
title="Search Engine Optimization">Search Engine Optimization</a></li>
        <li class="page_item page-item-20"><a
href="http://osadvantage.com/online-advantage/conversion/";
title="Conversion">Conversion</a></li>
        </ul>
</li>
</ul>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to