Comportement opposé de la position: collant avec en bas: 0

Lorsque vous spécifiez la position: collant avec en bas: 0, il se comporte différemment de la définition fournie par mdn. Contrairement à la description, où les éléments sont initialement traités comme relativement positionnés jusqu'à ce qu'ils dépassent un seuil et deviennent fixes, l'inverse se produit avec en bas: 0 spécifié.

Dans l'exemple de code fourni:

footer {
  position: sticky;
  bottom: 0;
}

MDN déclare que l'élément de pied de page doit d'abord être positionné relativement jusqu'à ce qu'il se déplace inférieur à 0px du bas de la fenêtre. Cependant, le comportement observé est l'inverse:

• Lorsque vous faites défiler vers le bas: le pied de page démarre comme positionné fixe, devient relativement positionné lorsque le bas du pied de page atteint 0px à partir du bas du sport de la vue. Le bas du pied de page passe au-delà de 0px du bas de la fenêtre.
• Raison pour le comportement opposé

La clé pour comprendre ce comportement réside dans le libellé de la définition MDN: "traité comme des éléments de position relative jusqu'à le thrashold spécifique est dépassé. "

Cela signifie que la position initiale est déterminée par la structure HTML et la distance au seuil spécifié. Dans le cas du bas: 0, le pied de page est déjà en bas de la fenêtre lorsque la page se charge. Ainsi, il démarre dans un état "fixe" car le seuil (0px en bas) est déjà dépassé.

Par conséquent, lors de la spécification de la position: l'élément collant: 0, l'élément sera initialement fixé et transition à une position relative lorsque l'élément passe au-delà du bas de la vue fixe. Ce comportement est opposé au comportement décrit dans la documentation MDN due à la position initiale déterminée par la structure HTML et à la proximité du seuil spécifié.