Ufdjrw

Plywood subfloor won't screw down in a trailer home

Why don't MCU characters ever seem to have language issues?

Make a transparent 448*448 image

What is the dot in “1.2.4."

Am I not good enough for you?

Can the druid cantrip Thorn Whip really defeat a water weird this easily?

Co-worker team leader wants to inject the crap software product of his friends into our development. What should I say to our common boss?

Does splitting a potentially monolithic application into several smaller ones help prevent bugs?

What is the definition of "Natural Selection"?

Counter-example to the existence of left Bousfield localization of combinatorial model category

What has been your most complicated TikZ drawing?

Is having access to past exams cheating and, if yes, could it be proven just by a good grade?

When were linguistics departments first established

"One can do his homework in the library"

What does おとこえしや mean?

Confusion with the nameplate of an induction motor

What to do when during a meeting client people start to fight (even physically) with each others?

redhat 7 + How to stop systemctl service permanent

How does Dispel Magic work against Stoneskin?

Do I need to leave some extra space available on the disk which my database log files reside, for log backup operations to successfully occur?

Why does Deadpool say "You're welcome, Canada," after shooting Ryan Reynolds in the end credits?

Provisioning profile doesn't include the application-identifier and keychain-access-groups entitlements

Touchscreen-controlled dentist office snowman collector game

How could a female member of a species produce eggs unto death?

Google recaptcha style problem, solve with css or javascript?

2

I'm using recaptcha v.2 for my website, but for some reason, it brakes the layout because it won't size the space of the parent box (div).

Here's my code:

<script type="text/javascript">
 var onloadCallback = function() 
 grecaptcha.render('recaptcha', 
 'sitekey' : 'mysitekey'
 );
 ;
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
async defer>

and html:

<div class="form-group">
 <div id="recaptcha" required=""></div>
</div>

The form-group is already max-width: 100%; but for some reason, the recaptcha doesn't follow that rule:

Here's an example:

https://careercollege.sehc.com/vancouver/programs/hca-diploma-program/.

Any suggestion?

css recaptcha

share|improve this question

asked Mar 6 at 17:32

user3833012user3833012

377

add a comment | 

2

I'm using recaptcha v.2 for my website, but for some reason, it brakes the layout because it won't size the space of the parent box (div).

Here's my code:

<script type="text/javascript">
 var onloadCallback = function() 
 grecaptcha.render('recaptcha', 
 'sitekey' : 'mysitekey'
 );
 ;
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
async defer>

and html:

<div class="form-group">
 <div id="recaptcha" required=""></div>
</div>

The form-group is already max-width: 100%; but for some reason, the recaptcha doesn't follow that rule:

Here's an example:

https://careercollege.sehc.com/vancouver/programs/hca-diploma-program/.

Any suggestion?

css recaptcha

share|improve this question

asked Mar 6 at 17:32

user3833012user3833012

377

add a comment | 

I'm using recaptcha v.2 for my website, but for some reason, it brakes the layout because it won't size the space of the parent box (div).

Here's my code:

<script type="text/javascript">
 var onloadCallback = function() 
 grecaptcha.render('recaptcha', 
 'sitekey' : 'mysitekey'
 );
 ;
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
async defer>

and html:

<div class="form-group">
 <div id="recaptcha" required=""></div>
</div>

The form-group is already max-width: 100%; but for some reason, the recaptcha doesn't follow that rule:

Here's an example:

https://careercollege.sehc.com/vancouver/programs/hca-diploma-program/.

Any suggestion?

css recaptcha

share|improve this question

asked Mar 6 at 17:32

user3833012user3833012

377

<script type="text/javascript">
 var onloadCallback = function() 
 grecaptcha.render('recaptcha', 
 'sitekey' : 'mysitekey'
 );
 ;
</script>
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
async defer>

<div class="form-group">
 <div id="recaptcha" required=""></div>
</div>

share|improve this question

asked Mar 6 at 17:32

user3833012user3833012

377

share|improve this question

asked Mar 6 at 17:32

user3833012user3833012

377

asked Mar 6 at 17:32

user3833012user3833012

377

asked Mar 6 at 17:32

user3833012user3833012

377

1 Answer
1

active

oldest

votes

1

I do this sometimes:

#recaptcha 
 overflow: hidden;
 border-right: solid 1px lightgray;

share|improve this answer

answered Mar 6 at 17:43

Burlyn84Burlyn84

428

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  It is a good solution, but it kind of cut the captcha logo
  
  – user3833012
  Mar 6 at 18:32
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  It does do that.
  
  – Burlyn84
  Mar 6 at 23:06
  

  
  
  
  

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55029022%2fgoogle-recaptcha-style-problem-solve-with-css-or-javascript%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

1

I do this sometimes:

#recaptcha 
 overflow: hidden;
 border-right: solid 1px lightgray;

share|improve this answer

answered Mar 6 at 17:43

Burlyn84Burlyn84

428

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  It is a good solution, but it kind of cut the captcha logo
  
  – user3833012
  Mar 6 at 18:32
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  It does do that.
  
  – Burlyn84
  Mar 6 at 23:06
  

  
  
  
  

add a comment | 

1

I do this sometimes:

#recaptcha 
 overflow: hidden;
 border-right: solid 1px lightgray;

share|improve this answer

answered Mar 6 at 17:43

Burlyn84Burlyn84

428

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  It is a good solution, but it kind of cut the captcha logo
  
  – user3833012
  Mar 6 at 18:32
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  It does do that.
  
  – Burlyn84
  Mar 6 at 23:06
  

  
  
  
  

add a comment | 

I do this sometimes:

#recaptcha 
 overflow: hidden;
 border-right: solid 1px lightgray;

share|improve this answer

answered Mar 6 at 17:43

Burlyn84Burlyn84

428

#recaptcha 
 overflow: hidden;
 border-right: solid 1px lightgray;

share|improve this answer

answered Mar 6 at 17:43

Burlyn84Burlyn84

428

answered Mar 6 at 17:43

Burlyn84Burlyn84

428

answered Mar 6 at 17:43

Burlyn84Burlyn84

428