overflow : hidden ; ne fonctionne pas sur Chrome avec les IFRAMEs ?

Question

J'ai un IFRAME avec des débordements cachés dans le css et le html. Cela fonctionne dans Firefox, mais pas dans Chrome/Safari.

Pourquoi ?

Answer 1

Bien, que diriez-vous :

<iframe scrolling="no" src="http://www.google.com" width="400px" height="300"></iframe>

dans le cas du scrolling="no"

http://jsfiddle.net/neSBS/

Answer 2

Après une recherche assez importante que j'ai faite sur ce sujet, je voudrais poster ma réponse, qui, je pense, pourrait être un complément à la réponse de Joonas :

<style>
    iframe {
        overflow:hidden;
    }
</style>
(...)
<iframe scrolling="no" src="http://www.google.com" width="400px" height="300"></iframe>

Je pense, que les deux scrolling y overflow:hidden devrait être fourni, bien que cette solution ne fonctionne pas dans une combinaison de Chrome et de doctype HTML5. scrolling est déprécié en HTML5 et l'attribut overflow n'affecte pas les iframes dans Chrome. Je suppose que ce dernier point est un bug, puisque la propriété Spécification HTML5 dit clairement :

En outre, HTML5 n'a aucun des attributs de présentation qui étaient dans HTML4 comme leurs fonctions sont mieux gérées par CSS :
(...)
- l'attribut nowrap sur td et th.
- attribut de règles sur la table.
- attribut de défilement sur l'iframe .
- attribut de taille sur hr.
- sur li et ul.
(...)

C'est dit clairement - en HTML5 scrolling doit être remplacé par CSS overflow .

Answer 3

<style>
    iframe::-webkit-scrollbar {  
    display: none;
}  
</style>

Tel que trouvé sur - Safari/Chrome (Webkit) - Impossible de masquer la barre de défilement verticale d'une iframe

Answer 4

C'est étrange mais - transform : rotate(0.00001deg) ; pour div avec overflow:hidden ; aide pour moi.

Answer 5

Juste width: 99.99%; a fait l'affaire pour moi.

J'ai eu ce problème dans Chrome mais pas dans Firefox.