Centering No Captcha reCaptcha
I went with:
<style>
/* already defined in bootstrap4 */
.text-xs-center {
text-align: center;
}
.g-recaptcha {
display: inline-block;
}
</style>
<div class="text-xs-center">
<div class="g-recaptcha" data-sitekey=""></div>
</div>
This css works fine for me:
.g-recaptcha{
margin: 15px auto !important;
width: auto !important;
height: auto !important;
text-align: -webkit-center;
text-align: -moz-center;
text-align: -o-center;
text-align: -ms-center;
}
This is similar to other answers, but I thought worth sharing. I don't like hard-coding values, but the width of the No Captcha reCAPTCHA appears to be 304px, so you could use that as your width:
<style>
div.g-recaptcha {
margin: 0 auto;
width: 304px;
}
</style>
<!-- reCAPTCHA -->
<div class="g-recaptcha" data-sitekey=""></div>
This should center the reCAPTCHA exactly.