Grow your CSS skills. Land your dream job.

[Solved] not sure if this is a Jquery or css problem

  • # January 9, 2010 at 3:00 pm

    I’m working on a site for a friend, and i used jquery for a dropdown menu, which works fine.

    Until I created a jquery image rotater in a div under it.

    now the menu drops behind the images.

    I didn’t want to post pages of code here, but if something will help I can.
    the url is http://ronguilmet.com/sandbox/

    # January 9, 2010 at 3:11 pm

    The problem is probably a CSS problem, the fix is created by using the z-index property:

    Add "z-index:100" to "ul.topnav li ul.subnav" (on line 135 of your CSS file)

    That tells your sub menu to be above your other HTML elements (since they have a lower z-index (0)).

    Rob
    # January 9, 2010 at 3:13 pm

    Hey.

    I have not actually looked at it – my interweb is pants at the moment due to some line issues… its bad enough trying to load the forums…

    but just check you have not floated one and not the other, or not cleared any floats… etc…

    I would look more, but I fear I would throw my PC out the window.

    # January 9, 2010 at 3:17 pm

    AshtonSanders

    thank you so much for your post.

    I added that to my css, and it’s fixed.

    Code:
    ul.topnav li ul.subnav {
    list-style: none;
    position: absolute; /*–Important – Keeps subnav from affecting main navigation flow–*/
    left: 0; top: 35px;
    background: blue;
    margin: 0; padding: 0;
    display: none;
    float: left;
    width: 170px;
    border: 1px solid #111;
    color: white;
    z-index: 100; /* fix for menu showing behind photos */
    }

    thanks again. Ron

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

You must be logged in to reply to this topic.

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