WPForms recaptcha field too wide on mobile

Hi @jespersw

Looks like you’re not alone experiencing this reCAPTCHA issue, there’s quite a long thread about it on their GitHub page here.

The good news is, there was a solution in the comments! You can add this CSS code to make it responsive.

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

Hope this helped!

Hi @aakash8,

Thank you for the reply. I did find that one too, but I am using Elementor and WPForms and I am not sure if I can add css manually to the right css file or where to do it?

To be able to add custom css through Elementor I would have to upgrade to a pro plan.

BR Jesper

Hi @jespersw

I don’t believe pro is required for this, there are multiple ways to add CSS. Here’s a guide that shows a few common ways: https://www.wpbeginner.com/plugins/how-to-easily-add-custom-css-to-your-wordpress-site/

Hey @jespersw – Thanks for contacting us and I apologize for the delay in getting back to your support request!

I looked at the website, and it seems that you may have fixed the reCAPTCHA issue. Here’s a screenshot.

In case you have any other questions, please feel free to reachout.

Kindly,

@aakash8 Thanks, the additional css and the code snippet worked! And I learned something new in the process. Thanks for helping out.

@prashantrai, it actually wasn’t fixed at that time. Maybe there was a browser/phone screen difference. Either how now it is working here as well.

Hey @jespersw – Thrilled to hear that it’s working now. If you have any questions about WPForms lite, please feel free to reach out.

Kindly,

Hey @jespersw – We haven’t heard back from you in about three days, so I’m going to go ahead and close this thread for now. But if you’d like us to assist further, please feel welcome to continue the conversation.

Thanks!