Z-index and position problem beyond CSS
Hey guys, I am having worlds of trouble trying to figure out how to get my navigation sub-menu's to not get cut-off by the main content wrapper. The parent theme I'm using is called Scrollider and is designed to cover up all the divs above it when the user scrolls. Its a great theme but I want those sub-menus to be on top no matter what. I got some help from a guy on another forum and he was able to get it to work in firefox with just changes to the css and adding/removing z-index to certain divs. It did not work on webkit browsers such as chrome however. He said the issue is that chrome creates a new stacking context when element "position: fixed" is used. He gave me an example of how it could be done with changes to both html and css, but I just cant put the puzzle together. The link to the other forum and our discussion is "http://stackoverflow.com/questions/15619797/z-index-on-home-page-navigation". The url to the site I'm working on is "www.kuhnflyfish.com". If you hover on a navigation item with a drop down and then scroll down you will see how the content wrapper overlaps it. If anyone can show me how to fix this I would be so appreciative. I'm still pretty new to this stuff I would love some wisdom.
Too many HTML errors that even the validator suppressed all past Line 664, Column 187.
Although there were 275 CSS errors reported, ignore any of the CORRECT CSS 3 rules that are flagged.
Not sure the scroll:navigation is a big problem as most people will select a page from the nav menu first without scrolling. Setting the nav menu so it isn't fix is one solution you may not like. Possibly clean up errors so all browsers are as close as can be "on the same page". Then a solution might be found.
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)