Re-size Captcha for smaller forms. -...

User 2434864 Photo


Registered User
5 posts

The smallest captcha one can have is the red, blackglass, and white.
But those captcha designs are actually too large for smaller web forms.

The css styles below actually reduce the size of the captcha image itself.
But there should be a way to reduce the size of the containing div. or frame?


CSS Style changes to the recaptcha image:

<style type="text/css">
#recaptcha_image img{
height:46px;
width:150px;
margin: 0px;
padding: 0px;
}
#recaptcha_container {
margin: 0px;
padding: 0px;
width: 150px;
}
</style>

How would one go about reducing the size of the captcha div. What other code would one add (in the CSS?)

If you could help please.

Peter
User 2287960 Photo


Ambassador
580 posts

Have you looked at:


#fb-captcha_control {
padding: 30px 0 !important;
}


Note you can change padding within Captcha Properties.

Keith
User 2434864 Photo


Registered User
5 posts

I tried to add a css width clause width: 150px; to the fb-captcha_control css option you specified, but it did not work.
Any ideas of what i should add that would work?

Thanks for your help!

Peter
User 2287960 Photo


Ambassador
580 posts

Are you viewing form in FireFox with Firebug. You should be able to see what needs changing.

Or you need to give a link to the form so someone can help you.

Keith
User 2434864 Photo


Registered User
5 posts

Here is the link to the test form as requested -

https://www.clsprivateconsulting.com.au … s/1/1.html

As you can see, as a test, I have been able to reduce the image inside the div - (I know right now it's too small to read. Later it will be bigger). I have not been able to reduce the outside div's though.

Peter
User 2287960 Photo


Ambassador
580 posts

From what I can see part is made of an image 343 x 72px:


.recaptcha_r1_c1 {
background: url("https://www.google.com/recaptcha/api/img/white/sprite.png") no-repeat scroll 0 -63px transparent;
height: 9px;
width: 250px;
}



I would be looking towards Google for the answer.

What about :
http://www.ehow.com/how_12218694_make-r … aller.html

There are limitations

Keith
User 2434864 Photo


Registered User
5 posts

Looked at the article

still limited, i think the smallest size is 300px or so?

Need smaller size one.
User 2434864 Photo


Registered User
5 posts

Seems like others have had similar issues - I searched for captcha in the forum. Coffee cup should implement other options for captcha like their competitors.
User 187934 Photo


Senior Advisor
20,271 posts

You can use reg expressions.;)
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2287960 Photo


Ambassador
580 posts

Eric - clever - good shout.

I do not like captchas.

Just tried using a simple sum.

If you do not understand read this article:

http://www.coffeecup.com/help/articles/ … m-builder/

Keith

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.