Comment redimensionner le reCaptcha V2 de google pour le responsive

Attention ! Cet article a plus de 1 an (2759 jours), ce qui signifie qu'il n'est pas forcément à jour !

J’étais en train de refaire le backend de mon blogue, j’en ai profité pour mettre à jour le style, le javascript, etc. J’ai mis le nouveau reCaptcha V2 de google… J’ai été surpris de constater qu’à l’air du mobile, Google n’a pas fait un captcha "responsive".

À première vue, ce n’est pas une mince tâche de le rendre jolie sur un mobile.

Alors voici le code CSS à mettre dans vos feuilles de style pour le rendre "responsive"… ou du moins présentable sur mobile.

CSS

@media screen and (max-height: 575px){
    #rc-imageselect,
    .g-recaptcha {
        transform:scale(0.77);
        transform-origin:0;
        transform:scale(0.77);
        transform-origin:0 0;
        -webkit-transform:scale(0.77);
        transform:scale(0.77);
        -webkit-transform-origin:0 0;
        transform-origin:0 0;
    }
}

Le résultat est beaucoup mieux. Google tu me déçois…

Catégories :