Google Recaptcha无响应大小

Question

所以我正在 english-lesson.16mb.com 开发一个网站，经过艰苦的工作，使用css制作注册表格，因此它可以在所有设备上做出响应，我把google recaptcha希望它变得敏感，但我面临的事实是google recaptcha有固定的大小。

我尝试添加style="width:50%;"或类似的任何类型，但它只会改变一些看不见的东西而不是盒子本身

橙色：风格前无形物的实际尺寸
蓝色：现在

我要问的是，如果我使用较小的屏幕，将从视图中裁剪验证按钮

我不想把水平滚动既不溢出-x也不是那样的东西，有没有办法改变google recaptcha的大小？

实时预览： english-lesson.16mb.com/register.php

Answer 1

我遇到了与recaptcha v2相同的问题。默认情况下它没有响应。在进行一些谷歌搜索之后，我可以设法用一些css hack来做。首先请记住，您需要在自动渲染中添加recaptcha而不是显式渲染。 look here

<script src="https://www.google.com/recaptcha/api.js" async defer></script>

<div class="g-recaptcha" data-sitekey="your_site_key"></div>

在风格

中添加以下css

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