9
votes

Cachez le débordement sur des éléments avec une position fixe

Y a-t-il un moyen de cacher le débordement d'un div fixe div avec un conteneur? Je pensais que fixé à l'intérieur fixe le ferait, mais il semble que ce n'est pas le cas. La seule solution de contournement que je peux penser est "inversé" masques: d'autres divs fixes cachant tout autour de l'un, mais ce serait mieux s'il y avait d'autres solutions.

Voici le violon:


5 commentaires

Retirez le fixe de la DIV intérieure et ajoutez la position : relatif; à eux. jsfiddle.net/pjfa6/12


La question ne fait référence qu'aux divs avec une position fixe.


Dans ce cas, la seule chose à laquelle je peux penser est de régler la Div interne en position absolue au lieu de fixe. jsfiddle.net/pjfa6/15 . Vous ne pouvez pas nier un élément fixe et l'avoir contenue dans son élément d'emballage autant que possible. Vous devriez le masquer, ce qui ne serait pas très gentil.


@Jeemusu merci, s'il vous plaît, vous postez votre commentaire comme une réponse alors je l'accepte


Étrangement Ceci est possible avec z-index dans safari 6.1. 4 ...: /


3 Réponses :


9
votes

Malheureusement, il semble être impossible de nier un élément fixe dans un autre élément (fixe ou non) et d'attendre que l'élément extérieur s'enroule et cacher tout débordement.

La seule chose à laquelle je peux penser est de régler la Div interne à Position: absolu au lieu de fixe. Voici un exemple basé sur votre jsfiddle: jsfiddle.net/pjfa6/15 .



0
votes

Dans certains contextes de navigateur mobile, utilisation de -webkit-overflow-défilement: toucher peut atteindre un élément de position fixe "coupé". Voir: https://miketaylr.com/posts/2015/06 /position-fixed-overflow-Hidden.html


0 commentaires

0
votes

avec un z-index: n'importe quelle valeur; instruction dans le conteneur fera dans certains navigateurs WebKit, comme Chrome.


0 commentaires