After sleeping on it, I found a custom CSS workaround rule that works for my form but probably not for everyone.
.wpcf7-form-control-wrap { /* this is too general, so YMMV */
position: unset;
}
This unsets the rule position:relative for the same selector. Ideally we would be able to only select that for elements that have child elements selected by .g-recaptcha or whatever, but alas CSS does not support such expressions AFAIK. This works for me because the reCAPTCHA is the only form element wrapped with this class of div element.
So my desperation is over, hope it helps others work around and helps the developers produce a robust solution 🙂
Hi
I can confirm the same problem. The other fields are as if readonly when I try to select them after adding a reCAPTCHA field. Removing the field restores them to functioning behaviour. I have switched themes and the form worked fine with the reCPATCHA field. Vishakha’s CSS hack did not solve the problem.
I would link you to the site, but it’s soon-to-be-launched (and therefore this is especially unfortunate). Perhaps I can link after launch if requested. I will need to launch without CAPTCHA for now :[
Thanks, I appreciate any investigation. Hope you can reproduce easily 🙂