DIV will not position fixed with experimental CSS3 menu
Question
Link to Development Site
[removed]
Issue Description
I am using an experimental CSS3 menu with a perspective feel, and I cannot get anything to be position:fixed; inside of the site.
The menu HAS to be inside of the <div id="perspective" class="perspective effect-pull-out"> as well as the <div class="perspective-wrapper"> and the <div class="wrapper"> in order to work properly with scrolling and the actual perspective piece.
This is messing up the modals on the page link above as well as the position:fixed; on the main site header. I tried to add some jQuery to it to prepend it directly below the <body> tag, but with no luck because I am using Advanced Custom Fields with a Repeater, and so it calls every modal up to the body, and only loads the first one. If a take the header and put it above the perspective menu, it works, but then I still can't figure out how to get the modals to work properly.
I think these two issues are both related to the menu because if I move the code to directly after the <body> tag, everything works great. Being as how it is a Wordpress site, I have template files and can not just put code anywhere I want to. I am using Bootstrap and Sass as well.
Any help is appreciated.
2 answers
solution1
0 2016-04-29 07:41:10
i know your problem as self experienced same thing with fixed pos in my own site, but easy to solve if you take fixed div outside of your perspektiv div, also make one big main div and then like table rows add divs for your needs. in this way modals will work as they have to. it will be good to see your fiddle , only with words without code it is hard to find answer.
you have duplicated id="bruce" many times, you can change id's from bruce to other persons on div you already duplicated. there is actually no problem in code if you remove name id's from perspektiv wrapper div and add after body as you said. only thing you have to change div IDs.
solution2
0 ACCPTED 2018-04-26 01:09:34
My issue was that I did not reset my Wordpress Query:
<?php wp_reset_query(); ?>
After I did that, it fixed my loop and reset the </div> that was causing the issue.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.