Search code examples
jquerycssoverflowsubmenu

Submenu not showing - overflow hidden?


my problem is that I got 3 submenus in the third nav named "Productos", but they are not showing.

I think maybe the error got something with the jQuery plugin kwicks... making it overflow:hidden;

I'm kinda new so I will appreciate your help ^^

Here is the link to the website

Edit: I remove the kwicks and I can see the submenu but I need the kwicks, Is there someway to bypass that??


Solution

  • Using Chrome I can see half of your first menu that has a text like "Maquinaria". I think that the menu is going to show inside its container.

    Have you tried setting an higher z-index?

    I have also checked with Developer tool and the overflow is correctly set to visible.

    EDIT:

    This is the code generated at runtime:

    <li id="kwick_3" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; position: absolute; left: 225px; width: 200px; overflow-x: hidden; overflow-y: hidden; display: block; " class="active">
        <a class="headlink" href="#">Productos<h3>Nuestros productos</h3></a>
        <ul style="visibility: visible; display: block; ">
           <li><a href="#">Maquinaria pesada</a></li>
           <li><a href="#">Transporte</a></li>
           <li><a href="#">Agroindustria</a></li>
        </ul>
    </li>
    

    The UL element has an overflow (x and y) set to visible. but the parent LI element has its overflow (x and y) set to hidden