0

Listen; I have read and read but couldn't find an answer that fit my problem.

I'm using Fancy Box on my website http://www.houdi.se/video.shtml but have the problem that the Fancy Box appears UNDER the menu when a video-link is clicked (its Responsive). Viewed in a browser there's no problem since it fill up. BUT when narrowing the browser the menu problem arises. Also viewing the top video in an iPad.

I'm using Adaption-plugin from ProjectSeven for the website. It's a Responsive CSS layout: http://projectseven.com/products/templates/pagepacks/adaptations/index.htm

That plugin also uses Project Seven's Pop Menu Magic 2 for the menu.

I'm not a code wizard but I have tried to increase z-index but it didn't work OR I have not increased the rift one?

Have now spent several hours working with this problem and happy for all help I can get. Just tell me what code you want to see (or have to see).

user1958842
  • 1

3 Answers3

0

Remove z-index from this div containing the menu:

<div id="p7PMM_1" class="p7PMMh19" style="position: relative; z-index: 999999;">

Emil Aspman
  • 996
  • 1
  • 17
  • 26
  • Thank you so much for trying to help me out.Darn. It didn't work. Have tried to look foor that instance in my CSS-files. Have made some changes but it didn't work. – user1958842 Jan 16 '13 at 19:02
0

The reason that the menu is on top of fancybox is because you're including the script 7PMMscrips.js on the page which manipulates the z-index and position properties of the main menu.

An ease way of solving this would be to just add the following css to your main css file: 

#p7PMM_1 {
    position: static !important.
}

That would solve the issue but i would not recommend it as using !important is a really bad practice. You can read more about why here: What are the implications of using "!important" in CSS?.

If i where you I would look into removing this script and create the main nav with just pure css instead.

Community
  • 1
  • 1
lingonhatt
  • 26
  • 2
  • Thank you for trying to help. Appreciate it a lot. Added this to my CSS-file but it didn't work. Maybe I did wrong or missed something? – user1958842 Jan 16 '13 at 19:04
0

Im no expert but looking at your css file for the navigation bar you don't have any z-index so you could try adding it.

your fancy box css file has several and the lowest is z-index: 8010; so setting you navigation to below that should resolve it.

Try using this code:

    .navigation {
    background-color: #000000;
    background-image: url(images/chameleon.jpg);
    background-repeat: no-repeat;
    background-position: 0px -60px;
    position: relative;
    z-index: 90;
    }
mally
  • 275
  • 2
  • 4
  • 18