Results 1 to 2 of 2

Thread: Dropdown Menu: Firefox a go, Safari and Chrome not displaying properly

  1. #1
    Join Date
    Nov 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Dropdown Menu: Firefox a go, Safari and Chrome not displaying properly

    OK so I have this menu issue that is baffling me.

    Here is one page where the menu does not work in Opera / Safari:
    http://74.208.93.31/viewthevibe/inde...ch_m4&Itemid=1

    Here is another where it magically does for some reason:
    http://74.208.93.31/viewthevibe/inde...property_uid=3

    For some reason in Firefox it looks great regardless of page however on the Search results page in both Chrome and Safari the drop down portion of the menu is displaying above the top level menu items. For the life of me I can't figure out what is wrong.

    Here is the CSS:

    .droplinebar{

    overflow: hidden;
    background: url(http://74.208.93.31/viewthevibe/bgheader.jpg) repeat-x top left #ffffff;
    width:935px;

    }

    img {

    border:0px;

    }

    .droplinebar ul{

    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
    font: bold 14px Georgia;
    background: url(http://74.208.93.31/viewthevibe/bgheader.jpg) repeat-x top left #ffffff;

    }


    .droplinebar ul li {
    display: inline;
    color: #efd9aa;

    }

    .droplinebar ul li a {

    float: left;
    text-decoration: none;
    color: #efd9aa;

    }

    .droplinebar ul li a:hover {
    float: left;
    color: #d1a101;
    text-decoration: underline;
    text-decoration: bold;


    }

    .droplinebar ul li a:visited {

    border:0px;

    }

    .droplinebar ul li a:hover, .droplinebar ul li .current { /*background of main menu bar links onMouseover*/

    color: #d1a101;

    }

    /* Sub level menus*/
    .droplinebar ul li ul {

    position: absolute;
    z-index: 100;
    left: 0;
    top: 0;
    background: #000000; /*sub menu background color */
    visibility: hidden;

    }

    /* Sub level menu links style */
    .droplinebar ul li ul li a {

    font: normal 14px Georgia;
    padding: 6px;
    padding-right: 20px;
    margin: 0;

    }

    .droplinebar ul li ul li a:hover { /*sub menu links' background color onMouseover */

    background: #000000;
    color: #d1a101;

    }


    And here is the menu code:

    <div id="mydroplinemenu" class="droplinebar" align="center">
    <ul>
    <li><a href="#"><img src="logo.jpg" /></a>
    <ul id="row1">
    <li><a href="#">Toronto North</a></li>
    <li><a href="#">Toronto East</a></li>
    <li><a href="#">Toronto South</a></li>
    <li><a href="#">Toronto West</a></li>
    <li><a href="#">Toronto Central</a></li>
    <li><a href="#">The Burbs</a></li>
    </ul>
    </li>
    <li><a href="#"><img src="vibe.jpg" /></a>
    <ul id="row2">
    <li><a href="#">Supper Club</a></li>
    <li><a href="#">Patio</a></li>
    <li><a href="#">Romantic</a></li>
    <li><a href="#">Hidden Gem</a></li>
    <li><a href="#">Be Seen</a></li>
    <li><a href="#">Wine Bar</a></li>
    <li><a href="#">Cheap & Cheerful</a></li>
    <li><a href="#">Bistro</a></li>
    <li><a href="#">Pub</a></li>
    </ul>
    </li>
    <li><a href="#"><img src="company.jpg" /></a>
    <ul id="row3">
    <li><a href="#">Friends</a></li>
    <li><a href="#">Stuck with The Kids</a></li>
    <li><a href="#">Two of You</a></li>
    <li><a href="#">Mom</a></li>
    <li><a href="#">Business</a></li>
    <li><a href="#">First Date</a></li>
    <li><a href="#">VIP</a></li>
    <li><a href="#">Ladies Night</a></li>
    <li><a href="#">On Your Own</a></li>
    </ul>
    </li>
    <li><a href="#"><img src="taste.jpg" /></a>
    <ul id="row4">
    <li><a href="#">International</a></li>
    <li><a href="#">Asian</a></li>
    <li><a href="#">Brunch</a></li>
    <li><a href="#">Seafood</a></li>
    <li><a href="#">Innovative</a></li>
    <li><a href="#">Steakhouse</a></li>
    <li><a href="#">After the Club</a></li>
    <li><a href="#">Delivery</a></li>
    <li><a href="#">Comfort Food</a></li>
    </ul>
    </li>

    </ul>
    </div>

    </div>


    Anyone have any ideas? Why does it display fine on the video page but not on the search listings page?! So odd.

  2. #2
    Join Date
    Nov 2010
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    anyone???

Bookmarks

Posting Permissions

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