Pourquoi mes boutons collants ne fonctionnent-ils pas dans IE 11 ?

Position : les boutons collants ne fonctionnent pas dans IE 11

Malgré les progrès du développement Web, certains problèmes de compatibilité peuvent survenir lors de l'utilisation des fonctionnalités CSS dans différents navigateurs. Dans ce cas, le problème concerne l'utilisation de la propriété sticky position dans Internet Explorer (IE) 11.

Problème :

Le code HTML fourni contient un div avec le classe "sticky-button-thing-not-working-on-ie" qui inclut des boutons. L'objectif est de rendre ce div collant, en garantissant que les boutons restent fixés en bas de l'écran pendant que l'utilisateur fait défiler. Cependant, ce comportement ne se produit pas dans IE 11.

Raison :

La propriété de positionnement collant, introduite dans les navigateurs modernes, permet aux éléments de rester dans leur position actuelle pendant que défilement, ce qui permet aux utilisateurs d'accéder facilement au contenu important. Malheureusement, IE 11 ne prend pas en charge cette propriété de manière native.

Solution :

Pour obtenir le comportement souhaité dans IE 11, une approche alternative consiste à utiliser la propriété de position fixe . Contrairement aux éléments collants, les éléments fixes conservent une position constante par rapport à la fenêtre, quel que soit le défilement. En combinant fix avec quelques autres ajustements CSS, il est possible d'émuler le comportement collant souhaité, garantissant que les boutons restent en bas de l'écran dans IE 11 et dans d'autres navigateurs modernes.

Modifié Code :

.sticky-button-thing-not-working-on-ie {
  position: fixed;                          /* added to support older browsers */
  position: sticky;
  bottom: 0;
  right: 0;
  background: rgba(0, 211, 211, 0.6);
}

Remarque : La propriété collante peut être supprimée en toute sécurité du code car elle ne l'est pas. utilisé de la manière prévue. Fixe, en revanche, fournit la fonctionnalité souhaitée pour les anciens navigateurs.

Informations supplémentaires :

• Les navigateurs Edge à partir de la version 16 prennent en charge la propriété de position collante. .
• Cette solution répond au problème spécifique des boutons qui ne restent pas fixes en bas de l'écran dans IE 11 tout en permettant compatibilité entre navigateurs.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!