Search code examples
menuheighthtmlfixed

Can't click "through" fixed div menu


I'm having problems with my fixed menu. As you can see of the example beneath it's not possible to click the links "Vingårde, Dyrkning..." because of the div box with the fixed menu on top of it. I've tried ordering the layers with z-index but I just can't get it to work. Can anybody help me out?

http://itu.dk/people/mbul/humlum/

And if anyone by the way have a method on auto adjusting the height of the page so it covers the whole viewport I would be very glad to hear from you :-) In the website version above I've set the height manually to 1000px which is not preferable

Thank you!


Solution

  • You need to put all the wrappers' elements outside of it and put them after the left-page container and before the right-page container. Finally, remove the wrapper, it seems unnecessary for the page in order to work.

    I fixed it through Chrome's dev tools, but I assume it should work if you modify the html that way.

    The body should look like this:

    <div id="left_page_container">...</div>
    <div class="nav_humlunvim">...</div>
    <div class="nav_butik">...</div>
    <div class="nav_blog">...</div>
    <div class="nav_kontakt">...</div>
    <div id="right_page_container">...</div>
    

    Hope it helps; as an extra observation it is more common to use "hyphen-separated-names" for selectors than to use "snake_case_names" :)