Sorry. Hard to isolate a sample as its a WP template and not public yet. I
need topper on top of all and section, aside and footer on top of header.
Header and topper are fixed.
On Fri, Jan 9, 2015 at 5:58 PM Karl DeSaulniers <k...@designdrumm.com>
wrote:

> A little hard to decipher what your doing here. If I understand correctly,
> you want topper and header to stay on top while scrolling except when they
> encounter footer? Or section aside and footer? Should footer cover topper
> and header always? Can you put up a code pen or GitHub?
>
> Usually I set the display property for these types of things. And don't
> forget to clear: both on header.
>
> Don't know if these are your fixes but things I personally would try. If
> you can put together a code pen or GitHub I could take a swing at it for
> you.
>
> Best,
> Karl
>
> Sent from losPhone
>
> > On Jan 9, 2015, at 3:45 PM, Tom Livingston <tom...@gmail.com> wrote:
> >
> > Unfortunately, I can't post a link. Hopefully someone can help me based
> on
> > the following info...
> >
> > Given this structure and style:
> >
> > @media only screen and (min-width:960px){
> >     .topper{position:fixed;z-index:10;}
> >     header{position:fixed;z-index:0;}
> >     section, aside, footer{position:relative;z-index:5;}
> > }
> >
> > <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>
> >
> > Narrower @media widths have no fixed elements. All relative. Obviously
> > there are more styles involved, but this works fine in Chrome, FF and
> IE11.
> > Safari (Mac) seems to have issues with the stacking. When scrolling down
> > the page, the header content is visually on top of the footer until I
> hover
> > a link in the footer. The entire footer then comes completely on top of
> the
> > header as desired. However, after this the section element is then behind
> > the header. It's very odd.
> >
> > I know a link is best, but does anyone have any ideas what might be
> > happening? And thoughts would be appreciated.
> >
> > Thanks 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/
>
______________________________________________________________________
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/

Reply via email to