Have you ever built a site that is completely responsive in all sizes, but then you notice the Google reCAPTCHA extends past the outer element forcing that dreaded space to the right side? Now you can fix it with the following CSS.

By default you would use .g-recaptcha, but if you’re using a plugin you’ll need to inspect the element to see what name is being given to the parent item by the plugin you’re using. In this case #fscf_recaptcha1 is the ID that was assigned by the plugin.

#fscf_recaptcha1 {
transform:scale(0.97);
-webkit-transform:scale(0.97);
transform-origin:0 0;
-webkit-transform-origin:0 0;
}

Like us on Facebook to learn how you can resize the verification squares that occasionally popup asking you to “Click all the squares that contain _____.” This media query is only a few lines long, and prevents that verification popup from pushing extra space on the right in your design.


Comments Box SVG iconsUsed for the like, share, comment, and reaction icons

4 weeks ago

67 Studios

This deal is going on for the rest of the year! #holiday #deals #yearendsale2020 #endtheyearstrong #website #websitedesign #websitedevelopment #turnkeysolutions #sharingiscaring ...

This deal is going on for the rest of the year! #holiday #deals #yearendsale2020 #endtheyearstrong #website #websitedesign #websitedevelopment #turnkeysolutions #sharingiscaring

2 months ago

67 Studios

πŸ‡ΊπŸ‡Έ Thank you to all of you! πŸ‡ΊπŸ‡Έ ...

πŸ‡ΊπŸ‡Έ Thank you to all of you! πŸ‡ΊπŸ‡Έ

3 months ago

67 Studios

Slicing up some audio for this short video production. 🀘🏻 ...

Slicing up some audio for this short video production. 🀘🏻