Grow your CSS skills. Land your dream job.

dropdown menu and IE6

  • # May 22, 2009 at 2:42 pm

    I have a small drop down menu made using the suckerfish method which gives me a hard time in IE6…

    What happens is that if there is some room to the right of one menu item the following one will be crammed there instead of dropping on the next line. Any ideas on how to fix that?

    Here is the link: http://socalscubainfo.com

    Thanks,
    Anton

    Rob
    # May 23, 2009 at 3:03 pm

    its probably because your float left is cascading from the #mainnav li so that every li within the #mainnav is floating left, when you really only want the actually main nav buttons to float left.

    # May 23, 2009 at 3:58 pm

    If it all floats left shouldn’t it actually display properly? It seems like there is no left alignment at all…

    # May 23, 2009 at 4:33 pm
    "Robskiwarrior" wrote:
    every li within the #mainnav is floating left, when you really only want the actually main nav buttons to float left.

    To re-iterate: You’ve got two "layers" of <li>s:

    The main navigation <li>s don’t move, and when you hover over them, the second layer of <li>s appear. This second layer of <li>s you don’t want to float left… right?

    Code:
    #mainnav li li {float:none}
    # May 23, 2009 at 5:17 pm

    Thanks guys! Now i got it working by adding the float: none. What threw me off was the float: left part. I thought that by adding the float: left it will do what i needed meaning to stay aligned to the left side but i got it now :oops:

    Thanks,
    Anton

    # May 23, 2009 at 5:23 pm

    One last issue that i have. On some of the pages i have a jump menu that will show over the drop down menus. Here is a link to a page that does that in IE6: http://socalscubainfo.com/us-west-coast … direction/ All other browsers seem not to have any issues with that. Any ideas on what can i do about that?

    Thanks for the help and sorry for the noob questions!
    Anton

    Rob
    # May 23, 2009 at 5:41 pm

    Hey – thanks Ashton for the roundup :)

    No worries Anton – never be embaressed about asking questions. :)

    And on the jump menu thing? sorry I cant see what you mean? Seems to work fine for me in IE6?

    # May 23, 2009 at 6:51 pm

    On that page if you go hover over "Charts" in the dropdown menu it will appear to be underneath the "Change region and chart" jump menu on my machine… I would hope it’s only happening here!

    # May 24, 2009 at 2:08 am

    z-index only works if the items in question are positioned. Try this:

    Code:
    #main-nav, #main-nav ul {
    margin:0;
    padding:5px 0 0 5px;
    position:relative;
    z-index:2;
    }

    #page-content {
    margin-bottom:7px;
    position:relative;
    z-index:1;
    }

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

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".