Recaptcha taille d'image fixe

Pourquoi est-recaptcha image fixe en taille 300x57 ? Même lors de la personnalisation de la div où l'image est injectée, la largeur et la hauteur de la div sont remplacés et mis à 300x57. Bien sûr, les images peuvent être redimensionnées après elle est rendue, mais pourquoi il n'y a pas d'options pour générer l'image à la taille de développeurs aimeraient qu'il soit.

http://code.google.com/apis/recaptcha/docs/customization.html

reCAPTCHA pourra compter sur la présence d'éléments HTML avec l'Id suivants pour afficher le CAPTCHA pour l'utilisateur: Un vide div avec l'ID recaptcha_image. C'est là que l'image sera placée. La div sera 300x57 pixels

Merci

InformationsquelleAutor ken | 2010-08-02
  1. 11
    #recaptcha_image img {
    width: 200px !important;
    height: 38px !important;
}
    InformationsquelleAutor Larry Cinnabar
  2. 1

    Vous pouvez remplacer css ajoutant des !important derrière une règle css, même dans un fichier externe.

    InformationsquelleAutor MatTheCat
  3. 1

    Personnalisation complète avec css, démo

    <form method="POST" action="">
<script type="text/javascript">
var RecaptchaOptions = {
tabindex: 1,
theme: 'custom',
custom_theme_widget: 'recaptcha_widget'
};
</script>
<div id="recaptcha_widget" style="display:none"><div id="recaptcha_image"></div>
<div class="recaptcha_only_if_incorrect_sol" style="color:red">Incorrect, please try again</div>
<span class="recaptcha_only_if_image">Enter the words above:</span>
<span class="recaptcha_only_if_audio">Type what you hear:</span>
<input type="text" id="recaptcha_response_field" name="recaptcha_response_field">
<div class="get_another_captcha"><a href="javascript:Recaptcha.reload()">Get another CAPTCHA</a></div>
<div class="recaptcha_only_if_image"><a href="javascript:Recaptcha.switch_type(&#39;audio&#39;)">Get an audio CAPTCHA</a></div>
<div class="recaptcha_only_if_audio"><a href="javascript:Recaptcha.switch_type(&#39;image&#39;)">Get an image CAPTCHA</a></div>
<div><a href="javascript:Recaptcha.showhelp()">Help</a></div>
<script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=YourAPI"></script>
<noscript><iframe src="http://www.google.com/recaptcha/api/noscript?k=YourAPI" height="300" width="500" frameborder="0"></iframe><br>
<textarea name="recaptcha_challenge_field" rows="3" cols="40">
</textarea>
<input type="hidden" name="recaptcha_response_field" value="manual_challenge"></noscript></div>
<script type="text/javascript">
window.onload = function() {
Recaptcha.focus_response_field();
}
</script>
<table cellspacing="0" cellpadding="4" border="0" style="font-family: Helvetica, sans-serif; color: #000000; font-size: 12px;"><tr><td><div><input type="submit" name="Button1" value="Submit"></div></td></tr></table></form>
    InformationsquelleAutor Developer
  4. 1

    Solution de travail pour le nouveau google Recaptcha (https://www.google.com/recaptcha/)

    <!--adjust to your needs -->
<div class="g-recaptcha" data-sitekey="your_sitekey" style="transform:scale(.8); margin:0 -30px">

    InformationsquelleAutor andrea.somovigo
  5. 0

    Cela a fonctionné pour moi et effectivement changé la largeur de l'ensemble de contrôler non seulement l'intérieur de l'image 

     #recaptcha_area
{
width: 250px !important;
height: 38px !important;
}
    InformationsquelleAutor msoliman
  6. 0

    Pour la nouvelle version de noCaptcha Recaptcha la suivante fonctionne pour moi:

    <div class="g-recaptcha" data-theme="light" data-sitekey="XXXXXXXXXXXXX"      
style="transform:scale(0.77);transform-origin:0;-webkit-transform:scale(0.77);
transform:scale(0.77);-webkit-transform-origin:0;transform-origin:0 0;"></div>

    Si vous avez échelle encore, il prend la taille d'origine de la div. Mais les solutions ci-dessus ne résout le vide de l'espace problème.

    Ref

    InformationsquelleAutor Muntasim