How to resize recaptcha? - coding-style

Question

How can I resize reCaptcha? I can't get it.

Answer 1

Select the 'custom' theme, and then you can make it any shape you want!

Answer 2

A simple trick I just learned to resize reCAPTCHA 2.0 is to use the following in CSS:
#recaptchaID {
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:scale(0.68); /* scale recaptcha image to fit */
transform:scale(0.68);
}
Then just apply it whenever you insert a reCAPTCHA into a page or form.

Answer 3

Best way to resize google recaptcha
Option 1: You can resize google ReCaptcha by using inline style.
A very first way for resizing google recapture by using inline style. Inline styles are CSS styles that are applied to one element, directly in the page's HTML, using the style attribute. Here is the example that shows you how you to style Google reCAPTCHA by using inline style.
<div class="g-recaptcha" style="transform: scale(0.77); -webkit-transform: scale(0.77); transform-origin: 0 0; -webkit-transform-origin: 0 0;" data-theme="light" data-sitekey="XXXXXXXXXXXXX"></div>
Option 2: By putting the following style in your page (Internal Style Sheet).
Secondly, you can put style for ReCaptcha into the page between and . An internal style sheet is a section on an HTML page that contains style definitions. Internal style sheets are defined by using the tag within the area of the document. Here is the example that shows you how you to style Google reCAPTCHA by using an external style sheet.
<style type="text/css">
.g-recaptcha{
transform:scale(0.77);
-webkit-transform:scale(0.77);
transform-origin:0 0;
-webkit-transform-origin:0 0;
}
</style>
Option 3: Resize google ReCaptcha by using an external stylesheet.
Create a separate file and give a name like style.css and add this file link in between your an element in your page. For ex. .
<style type="text/css">
.g-recaptcha{
transform:scale(0.77);
-webkit-transform:scale(0.77);
transform-origin:0 0;
-webkit-transform-origin:0 0;
}
</style>