What to do if css3 sticky does not take effect

Solutions for css3 sticky not taking effect: 1. The parent element cannot have overflow: hidden or overflow: auto attributes; 2. One of the top, bottom, left, and right values ​​must be specified; 3. The height of the parent element cannot be lower than that of the sticky element height.



The operating environment of this tutorial: windows7 system, css3 version, this method is applicable to all brand computers.

Recommendation: "css video tutorial"

sticky does not take effect. The reasons are: the

parent element is set to overflow: hidden or overflow: auto

and none of the top, right, bottom, and left values ​​are specified. The

height of the parent element is smaller than the

sticky attribute of the element positioned by sticky. Depending on the user's scrolling, switch between position:relative and position:fixed positioning.

Element positioning is shown as relative positioning before crossing a certain threshold and fixed positioning afterwards.

The sticky attribute is only valid when the following conditions are met: the

parent element cannot overflow:hidden or overflow:auto attribute

must specify one of the top, bottom, left, right four values, otherwise it will only be relatively positioned

at the height of the parent element. The height of the sticky element