Certain animations causing scrollbars in Firefox

[daneden]

The CSS spec says that translateY/translateX shouldn't affect layout, but in Firefox the following animations cause scrollbars to appear on the page:

• bounceOutRight
• bounceOutDown
• fadeOutRightBig
• fadeOutDownBig

The following animations also cause scrollbars, but are removed when the animation ends:

• bounceInRight
• bounceInUp
• fadeInRightBig
• fadeInUpBig

Whether this is an issue with Mozilla's implementation of the translate property or an issue with using the translate property itself is not yet clear.

[daneden]

Seems this is implemented correctly by Firefox. In the spec, it says that transforms don't affect the document layout, but they do affect the overflow area. Until I think of a better fix, best solution is to use overflow-x: none;