Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #4765

    Hi,

    http://soulmatestars.com

    The first drop down is not working properly!

    In IE, I have to be very clear and precise to get to the drop down, otheriwse it pulls up the drop down for the Second menu right below it.

    In Firefox, the first drop-down doesn’t pull down at all!!!!

    Here is the code form Style.css:

    /*navigation pages*/

    .nav_wrapper{

    position: relative;

    height:36px;

    padding-top:196px;/*280px;*/

    z-index: 6;

    }

    #top .nav{

    position: relative;

    height:36px;

    list-style-type: none;

    list-style-position: outside;

    margin:0;

    z-index: 6;

    font-size: 12px;

    float: left;

    }

    .nav li a{

    display:block;

    float:left;

    padding:6px 25px 6px 3px;

    width:auto;

    border: none;

    text-decoration: none;

    line-height: 24px;

    outline: none;

    }

    .nav ul{

    margin:0;

    padding:0;

    list-style-type:none;

    list-style-position:outside;

    position:relative;

    line-height:50px;

    z-index:5;

    }

    #top .nav ul a{

    line-height:20px;

    font-size: 12px;

    cursor: pointer;

    }

    #top .nav li{

    float:left;

    position:relative;

    z-index:20;

    }

    #top .nav li li{

    border-left:none;

    margin-top:0;

    }

    #top .nav ul {

    display:none;

    position:absolute;

    top:36px;

    width:172px;

    left:-9px;

    }

    #top .nav li ul a{

    width:150px;

    height:auto;

    float:left;

    text-align:left;

    padding:4px 10px;

    }

    #top .nav ul ul{

    top:auto;

    border-top:none;

    }

    #top .nav li ul ul {

    left:171px;

    top:-1px;

    }

    #top .nav li:hover ul ul, #top .nav li:hover ul ul ul,#top .nav li:hover ul ul ul ul{

    display:none;

    }

    #top .nav li:hover ul, #top .nav li li:hover ul, #top .nav li li li:hover ul, #top .nav li li li li:hover ul{

    display:block;

    }

    #top .nav li ul a{

    border-top:none;

    }

    /*navigation categories*/

    .catnav{

    position: relative;

    list-style-type: none;

    list-style-position: outside;

    margin:0;

    width:956px;

    float: left;

    z-index: 4;

    }

    .catnav_wrapper{

    position: relative;

    width:958px;

    float: left;

    line-height:50px;

    z-index: 4;

    }

    .catnav li a{

    display:block;

    float:left;

    padding:13px 10px 20px 10px;

    /*width:114px;*/

    border: none;

    text-decoration: none;

    line-height: 17px;

    outline: none;

    min-height:30px;

    }

    .catnav li a strong{

    display:block;

    font-weight: bold;

    font-size: 14px;

    }

    .catnav li li a strong {

    display:inline;

    font-size:12px;

    font-weight:normal;

    }

    .catnav li a span{

    display:block;

    font-size: 10px;

    }

    .catnav ul{

    margin:0;

    padding:0;

    list-style-type:none;

    list-style-position:outside;

    position:relative;

    z-index:5;

    }

    #top .catnav ul a{

    line-height:29px;

    font-size: 12px;

    cursor: pointer;

    }

    #top .catnav li{

    float:left;

    position:relative;

    z-index:20;

    margin-top:0;

    }

    #top .catnav li li{

    border-right:none;

    margin-top:0;

    }

    #top .catnav ul {

    display:none;

    position:absolute;

    top:47px;/*changed the positioning of the drop down*/

    width:325px;

    left:-2px;

    }

    #top .catnav li ul a{

    width:300px;

    height:auto;

    float:left;

    text-align:left;

    padding:0 10px;

    }

    #top .catnav ul ul{

    top:auto;

    border-top:none;

    }

    #top .catnav li ul ul {

    left:171px;

    top:-1px;

    }

    #top .catnav li:hover ul ul, #top .catnav li:hover ul ul ul,#top .catnav li:hover ul ul ul ul{

    display:none;

    }

    #top .catnav li:hover ul, #top .catnav li li:hover ul, #top .catnav li li li:hover ul, #top .catnav li li li li:hover ul{

    display:block;

    }

    #top .catnav li ul a{

    border-top:none;

    }

    #top .catnav .noborder, #top .catnav .noborder a{

    border:none;

    }

    Please help!

    Thanks

    Srishti

    #47459

    Hey,

    in style.css search for following code:

    .nav_wrapper{
    position: relative;
    height:36px;
    padding-top:196px;/*280px;*/
    z-index: 6;
    }

    and change it to:

    .nav_wrapper{
    position: relative;
    height:36px;
    padding-top:196px;/*280px;*/
    z-index: 20;
    }

    #47460

    Worked beautifully! Thanks!!!! :D

    #47461

    Glad that I could help you :)

    #47462

    Hey Dude,

    Changing hte z-index worked so the menus were showing up great, but I noticed that:

    -> the cursor in the rest of the header area has just become a text cursor. The search box has the Default cursor.

    -> The “logo”, the “search box”, “social media icons” are all unclickable. Can’t even type in the search box.

    I have not changed any css for z-index or cursors except the one you told me to change above for nav_wrapper.

    Please help!

    Thanks

    Srishti

    #47463

    The only chance to sole the cursor issue is to move the menu downwards (or you can decrease the logo size). The reason is that the menu overlaps the logo which causes the cursor to change. You can change following code in style.css to push the menu downwards – cange the padding top value:

    .nav_wrapper{
    font-family: Arial, Helevtica, Verdana, san-serif;
    position: relative;
    height:36px;
    padding-top:196px;/*280px;*/
    z-index: 20;
    }

    #47464

    thanks Dude!!!!

    I changed the positioing of the logo and changed the z-index of nav_wrapper back to 6. It looks much better now.

    #top .logo, #top .logo a{

    display:block;

    height:137px;

    width:485px;

    position:absolute;

    left:122px;

    top:16px;

    border: none;

    padding: 0;

    margin:0;

    z-index: 10;

    }

    I see text icon on both sides of the logo but the logo is clickable now and the search box is functional!

    :) so it’s good enough for now~~ :)

    #47465

    Glad that it works now :)

Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘first drop down doesn't work!’ is closed to new replies.