The reCAPTCHA width in the main comment form has a wrong width causing it to be misaligned with respect to other elements. The left column has the width of 43%, so the right column's width should be 57%. But it is set to 55%. This change fixed the issue for me:
--- wpdiscuz.js 2021-08-09 16:16:48.563122385 +0000
+++ wpdiscuz.js 2021-08-09 16:16:44.467102081 +0000
@@ -446,7 +446,7 @@
"-webkit-transform": "scale(0.8)"
});
$("#wpdcom .wpd_main_comm_form .wpd-form-col-left").css({"width": "43%"});
- $("#wpdcom .wpd_main_comm_form .wpd-form-col-right").css({"width": "55%"});
+ $("#wpdcom .wpd_main_comm_form .wpd-form-col-right").css({"width": "57%"});
$("#wpdcom .wpd-secondary-form-wrapper .wpd-form-col-left").css({"width": "30%"});
$("#wpdcom .wpd-secondary-form-wrapper .wpd-form-col-right").css({"width": "70%"});
}
It would be great if it will be included in future versions.
Hi @cartoonist,
This is just a small CSS conflict with the theme or other plugins. Please leave some example URL to allow us to debug the issue and provide some solution for you.
Thanks Asti for your reply!
I reverted the `assets/js/wpdiscuz.js` file back to the original and here is the example URL: https://car.toonist.ir/?p=1. The site is in Persian language which is an RTL one. The main comment form has this issue. You can compare it with comment forms in the replies in the site.
I noticed that the sum of the right column width and the left one is always 100% in secondary comment forms, but it is not the case for the main one.
I change the theme to "Twenty Twenty-One" and the reCAPTCHA looks totally fine. As you mentioned, it is just a small conflicts with the theme. I would be grateful if you could give me a hint where should I look for to fix it. Thanks 🙂
