How to adjust Captcha width
-
I used Captcha on the WordPress’s login page, which is not wide enough on the PC and too wide on the mobile device.
Because of captcha uses iframe display, how can I adjust it to make it as wide as other input fields.
F12 Elementor
Other input fields css on the PC {width:48%;}
Other input fields css on the mobile device {width:100%;}
-
I turned on the setting Remove CSS and got the screenshots.
Result：The width of Captcha on the pc has become shorter.
Select type：v2: “I am not a robot” check box
Setting
PC
mobile device
In the question I originally asked, the screenshot of the pc was wrong. (The screenshot of my mobile device is repeated)
The screenshot of the pc that has not been opened to remove the css setting is here.
Setting
PC
Hello @bi1012037
Thanks for the update. Can I ask, are you using the standard wp-login form or something custom?
By default, and if your using the standard wp-login form (unless the Remove CSS option is enabled) the plugin tries to force the login box to be 350px so that it should always be wide enough to ensure the captcha field does not expand further than the inputs above it. If your using a custom form you may need additional CSS but this will only ensure your form can never be less than 350px and wont resize the captcha field.
As the captcha field is an iframe (something we cant change of course), we have no control and cant force it to match other input widths without resorting to JS hacks sadly but it is possible to enable “compact” mode however, which will ensure the field is not wider than the inputs as seen here
To do this, within our plugins settings set the “Size” option to “Compact”:
Which will result in the alternative style you can see here:
If there is anything else, do let me know.
Kind regards, Daniel @ WP White Security
The topic ‘How to adjust Captcha width’ is closed to new replies.
