S J Paul Chowdhury S J Paul Chowdhury - 7 months ago 13
HTML Question

CSS3 simple Text Animation, overlaps fixed Navigation bar when scrolled, although the content area of the text doesn't?

So, it as the title says, I have a fixed position navigation, followed up by a banner and a content area, and I am using

Animate.css
(from github), to style a simple header, in the content area. The header behaves fine when not in an animated state and does not overlaps the navigation upon zooming and scrolling the page, but after the animation it overlaps.

I had the same issue with my banner after animation, but i could sort it our by setting
position:relative;
and
z-index:0
;

Any help is appreciated.

Answer

-webkit-animation-fill-mode: backwards seems to solve the problem, it is now working as expected.

I do not understand why the z-index manipulation didn't help in this case but it did in the case of banner.