Lead Capture Form (width of CAPTCHA image in widget area)

Greetings!

I just integrated CAPTCHA on the Lead Form under Lead Form Settings. It displays well on the Home Page (see below and attached); however, on other pages, when it displays in the widget area, the CAPTCHA image is too large and extends outside the form (see below and attached). Can this be adjusted?



This relates to this website: http://bobknuppbuilders.com/

Thanks for your help and advice.

Glory

 

Hi, Glory..

Greetings from InkThemes!

Please paste the code given below in Custom CSS field (Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

img#recaptcha_challenge_image {
    width: 90%;
}

Change the numeric value as per the requirement.

Hope it will resolve your issue

Do let me know if you need more assistance,
Thanks & Regards!
Priyanka
InkThemes.com

 

Priya,

Your supplied code partially resolves the issue.

Now: Is there a way to center the CAPTCHA image within BOTH forms? [On one form (the inner page one) it seems to be justified too far to the left; I'd like them to be consistent. And it seems centering would be the best option.]

Thank you.
Glory

 

Hi, Glory..

Please paste the code given below in Custom CSS field of your dashboard.

Code:

div#recaptcha_widget div#recaptcha_image {
    text-align: center;
    width: 100% !important;
}

And,

Code:

form img {
    margin-left: -257px;
    width: 48%;
}

Thanks & Regards!
Priyanka
InkThemes.com

 

Hi, Priya...

Thanks for the code suggestions, however, I've had some issues.

Re: http://bobknuppbuilders.com/

I pasted the first code and it seemed to center the image on the lead form on the home page.

However, the second one skewed the image way to the left outside of the lead form on both home page and widget area. [See images.] Could that be due to earlier code that had been added? [I've removed the second code that you suggested. ]



Here is Custom CSS now:

.sidebar {
padding-left: 42px;
}

input.btnsubmit {
width: 194px !important;
}

.body_wrapper {
padding: 30px 30px 30px 30px !important;
}

.showcase-thumbnail-container {
display: none;}

#menu .ddsmoothmenu li li a {
width: 237px;
}
#menu .ddsmoothmenu li ul{
width: 271px !important;
}
.topinfobar .siteinfourl p {
width: 172px;
margin-left: -57px;
}

img#recaptcha_challenge_image {
width: 85%;
}

div#recaptcha_widget div#recaptcha_image {
text-align: center;
width: 100% !important;
}
Thanks a lot!
Glory

 

Hi, Glory..

Please delete margin-left=-257px; from the second code and check after that....