Google reCAPTCHA v2 ignores CSS alignment

Question

I'm trying to align a Google reCAPTCHA v2 element to the right side of my page, but it seems to be ignoring my styling.

I have tried to use CSS, HTML, PHP, and JavaScript to move the element, but nothing has worked — the reCAPTCHA div still aligns itself to the left side of the page. My code is not throwing any errors.

Every time the page reloads, the div seems to align to the right for an instant, but when the page finishes loading, it becomes left-aligned again. It almost seems like it's hard coded to be left-aligned for my domain, specifically. Is this the case? What can I do to override the div 's default styling?

Here is what I've tried so far:

HTML:

<div id='html_element'></div>
<script src="https://www.google.com/recaptcha/api.js onload=onloadCallback&render=explicit" async defer></script>

CSS:

.html_element {
    float: right;
}

Answer 1

On the demo page: https://www.google.com/recaptcha/api2/demo

I used CSS to try align it some other way than left:

It appears the div it is in, if you use text-align: -webkit-center; it moves to the center. Align left, right etc do nothing, but webkit-* does :)

Not sure if it helps, but hope it does.