Recaptcha crée une iFrame sur la page, ce qui casse le style de la page

Question

Recaptcha ajoute une iFrame "Ce cadre permet d'éviter les problèmes de cache avant/arrière dans Safari" en haut de mon site web (code inclus ci-dessous), ce qui décale le style de 20-30px (environ).

Si je mets display: none; à l'élément dans Firebug, cela a réglé le problème.

Quelqu'un sait-il pourquoi cet élément a une hauteur (je n'ai pas de CSS qui s'applique aux iFrames) ? Ou comment définir display : none ; sur cet élément ?

<iframe src="about:blank" style="height: 0px; width: 0px; visibility: hidden; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; ">
    This frame prevents back/forward cache problems in Safari.
</iframe>

Answer 1

Essayez le CSS ci-dessous :

/* ReCaptcha Iframe FIX */
iframe {display:none !important;}
header iframe,
section iframe,
footer iframe,
div iframe { display:inline; }

Si vous n'avez pas à vous soucier d'autres cadres sur le site, une version plus simple devrait suffire :

iframe {display:none !important;}

Vous pouvez aussi cibler toutes les iframes où src="about:blank" :

iframe[src="about:blank"]{display:none;}

Answer 2

iframe[src="about:blank"]{display:none;}

Cela correspond à toutes les iframes dont l'attribut "src" est "about:blank".

Answer 3

Cela semble plus simple et plus précis :

body > iframe { display:none !important; }