The rule is simple, if you have an element with overflow: hidden
, and a child with position: absolute
, in order to break free from the parent restriction, remove all position: relative
from its way to the parent. Absolutely positioned elements ignore the overflow property.
Lesson learnt
In a project, setting the overflow on a div to hidden, no matter what I did, or thought I did, the original height of the element streched the body beyond its height. Turned out I was having a position: absolute checkbox, with opacity: 0
. The solution was of course, to set the relative position to the scrolling element itself.
