Bootstrap Affix on bottom scroll glitch (Chrome and Firefox) -


Simple page, with a 2-level header, where the second layer picks up.

Here the page is skeleton:

If you resize your browser around 630px height and try to scroll down, then you should note the scrolling glitch. There is no problem in IE9, but it affects Chrome and Firefox.

Any help is appreciated :)

In the header < Code> .affix is applied when you can offset the .content div:

  Header2.affix + .content {margin-top: 82px; }   

tested in FF32 and CH37 (this is not IE9 VM on this PC, sorry)

Demo:


Some background:

The problem is that once the .affix class is applied, then .header2 div Inherits status: fixed . It brings .header.affix div out of its place in the DOM, so that the .content div is immediately snaped at the top of the page and hidden below (now fixed) .header2 div

Comments

Popular posts from this blog

java - ImportError: No module named py4j.java_gateway -

python - Receiving "KeyError" after decoding json result from url -

.net - Creating a new Queue Manager and Queue in Websphere MQ (using C#) -