Pourquoi « overflow : hidden » ne fonctionne-t-il pas sur les éléments parents et enfants à position fixe ?

Débordement : caché ne fonctionne pas sur l'élément parent/enfant fixe

Question :

Pourquoi le débordement ne : fonction de propriété cachée sur parent/enfant fixe éléments ?

Exemple :

.parent {
  position: fixed;
  overflow: hidden;
  width: 300px;
  height: 300px;
  background: #555;
}

.children {
  position: fixed;
  top: 200px;
  left: 200px;
  width: 150px;
  height: 150px;
  background: #333;
}

<div class="parent">
  <div class="children"></div>
</div>

Réponse :

Clip CSS : rect() peut couper un élément positionné fixe à son parent. Cependant, il comporte quelques mises en garde :

• La position du parent ne peut pas être statique ou relative.
• Les pourcentages ne sont pas pris en charge pour les coordonnées rect (bien que auto soit équivalent à 100 %).
• Les éléments enfants peuvent avoir des options de positionnement et de transformation CSS3 limitées.

Voir la mise à jour Démo JSFiddle pour un exemple d'utilisation de clip : rect().

Notes supplémentaires :

• Utiliser la visibilité arrière : cachée sur les éléments enfants pour une meilleure prise en charge dans Chrome.
• La prise en charge des anciens navigateurs et des navigateurs mobiles peut être limitée.

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!