Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Jul 2005
    Posts
    17
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Big CSS menu won't work properly

    Really hopeful some can assist...

    I'm completely by the problem I'm having getting my menu to work in this test page.
    I'm desperate for help!!!!

    http://www.skinspired.co.uk/test2010/index.html

    I have some of these drop-downs working successfully (click on the drop-downs of Baqueira, Formigal, About Us to see.)

    So I want to add sub-items for the booking link at the top, but I'm having no success. All I get is the hover behaviour.

    I've simply copied the code for the other menu items for my booking items and sub-items - but I just can't see why it doesn't work.

    Can anybody have a look at the HTML in my page and assist?

    The CSS I'm using is below:

    /*All the navbar stuff*/
    #container{width: 900px; margin: 0px auto;}
    #content{padding: 10px 0px;}

    #nav{height: 40px; background: #ccc;}
    /*#navlist{margin: 0; padding: 0;}*/
    /*#navlist li{display: inline; list-style: none; margin: 0; padding: 0;}*/
    /*#navlist li a{float: left; display: block; background: #555; color: #fff; height: 19px; width: auto; padding: 10px; margin: 0 1px 0 0;

    border-bottom: 1px solid #fff; text-decoration: none;}*/
    /*#navlist li a:hover{background: #111; border-bottom: 1px solid #111; text-decoration: underline;}*/
    /*#navlist li a:hover{text-decoration: underline;}*/
    /*#navlist li a.active{background: #111; border-bottom: 1px solid #111;}*/

    .columnnav{width: 200px; float: left; }
    .columnnav ul, li{display: list-item; list-style: none; margin-left:-15px; }
    .columnnav a{color: #fff; text-decoration: none;}
    .columnnav a:hover{color: #fff; text-decoration: underline;}

    .dropdown-b{position: absolute; top: 24px; left: 64px; width: 600px; height: auto; color: #fff; padding: 5px; margin:0; background: #46A3C8; display: none; z-index: 100;}
    .dropdown-f{position: absolute; top: 24px; left: 149px; width: 500px; height: auto; color: #fff; padding: 5px; margin:0; background: #46A3C8; display: none; z-index: 100;}
    .dropdown-e{position: absolute; top: 24px; left: 300px; width: 150px; height: auto; color: #fff; padding: 5px; margin:0; background: #46A3C8; display: none; z-index: 100;}
    .dropdown-bo{position: absolute; top: 24px; left: 400px; width: 150px; height: auto; color: #fff; padding: 5px; margin:0; background: #46A3C8; display: none; z-index: 100;}
    .dropdown-au{position: absolute; top: 24px; left: 548px; width: 150px; height: auto; color: #fff; padding: 5px; margin:0; background: #46A3C8; display: none; z-index: 100;}

  • #2
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,955
    Thanks
    9
    Thanked 726 Times in 720 Posts
    It looks like you haven't added the necessary code for the booking menu to your jdiv.js javascript.

  • Users who have thanked SB65 for this post:

    coderchap (09-06-2010)

  • #3
    New Coder
    Join Date
    Jul 2005
    Posts
    17
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Yes, that solved it, thanks so much!


  •  

    Posting Permissions

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