Curious, but what is the css for "wrap" ? if it is absolute positioning or relative? That would make a difference on its children. Sry, reaching blind here.
Best, Karl Karl DeSaulniers Design Drumm http://designdrumm.com On Jan 21, 2015, at 4:53 PM, Tom Livingston <tom...@gmail.com> wrote: > Unfortunately, I still can't post a link for this. Hopefully someone > smarter than me can help me based on the following info. I'm still stumped > on this. The problem only appears in latest Safari. > > Given this structure and style: > > @media only screen and (min-width:960px){ > .topper{position:fixed;z-index:1000;} > header{position:fixed;z-index:0;} > section, aside, footer{position:relative;z-index:500;} > } > > <div class="wrap"> > <div class="topper">[children]</div> > <div class="header">[children, including html5 video element on one > page]</div> > <section>[children]</section> > <aside>[children]</aside> > <footer>[children]</footer> > </div> > > .topper is to be stacked above all others and fixed > header is to be behind others and fixed > section, aside and footer scroll on top of header and under topper > Narrower @media widths have no fixed elements. All position:relative; > > Obviously there are more styles involved and there is additional > content/structure inside these main elements, but this works fine in > Chrome, FF and IE11. Safari (Mac) seems to have issues with the stacking. > When scrolling down some pages, the header is visually on top of the footer > or aside until I hover any link inside the aside or footer. The entire > footer/aside then comes completely on top of the header as it is supposed > to. However, after this occurs, the section element is sometimes *behind* > the header which it wasn't previous to hovering the mentioned link. It's > really very odd. Almost browser-bug like. > > I know a link is best, but does anyone have any ideas what might be > happening? I have read that position:fixed; can create stacking context > issues. I'm not sure what that means really or how to overcome it. > > I've tried suggestions from the first time I posted this with no luck. > > Any thoughts would be appreciated. > > Thank you again in advance. > ______________________________________________________________________ > css-discuss [css-d@lists.css-discuss.org] > http://www.css-discuss.org/mailman/listinfo/css-d > List wiki/FAQ -- http://css-discuss.incutio.com/ > List policies -- http://css-discuss.org/policies.html > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
