2014-11-24 14 views
5

I zostały wdrożone Googles nowy checkbox recaptcha tak:Stylizacja nowego pola wyboru recaptcha google?

<div class="g-recaptcha" data-sitekey="MY_SITE_KEY"><div> 

Po załadowaniu zawartości iframe wyglądać następująco:

<div class="rc-anchor rc-anchor-standard"> 
    ... 
</div> 

enter image description here

Oto style zdefiniowane dla bieżącego wygląd :

.rc-anchor-standard { 
    background: #f9f9f9; 
    border: 1px solid #d3d3d3; 
    color: #000; 
} 

Staram się osiągnąć taki wygląd:

enter image description here

Dodałem to do mojego pliku CSS:

.rc-anchor-standard { 
    background: #ffffff !important; 
    border: 0px !important; 
    color: #ffffff !important; 
} 

Styl nigdy się nie zmienia ... Każdy myśli, dlaczego nie jest to pracujący?

Dzięki, -Paul

+1

http: // s tackoverflow.com/questions/217776/how-to-apply-css-to-iframe – MrPk

+1

@paul Mam do czynienia z tym samym problemem. Czy byłeś w stanie to rozwiązać? Jeśli tak, to w jaki sposób? –

+0

Próbuję zrobić coś podobnego, chcę dodać własne niestandardowe komunikaty o błędach do elementu div z klasą "rc-anchor-alert". Nie mogę uzyskać do niego dostępu za pomocą JQuery. – Bryan

Odpowiedz

-3

początek, zapomniałeś średnik ';' po znaku granicznym,

border: 0px !important 

być może to anulowanie białego tekstu i kodu granicznego. Naprawię to i zobaczę, czy coś się zmieni.

========================================

Jeśli ta to nie jest kolejna literówka, to może być powód:

Dzwonisz tutaj 2 oddzielne klasy div, ale masz je napisane jako div wewnątrz div.

.rc-anchor .rc-anchor-standard { 

Wymień że^z tym V:

.rc-anchor, .rc-anchor-standard { 
+0

Przepraszam, że brakujący półkolem był literówką podczas wysyłania. Niestety element div jest ładowany za pomocą elementu iframe, którego Google używa po przygotowaniu modelu DOM, więc nie mam do niego dostępu. – Paul

+0

Nie jest to pomocne przy uzyskaniu rozdzielczości OQ. – Bryan

2

Te style są umieszczone wewnątrz iframe z innej domeny (google.com), więc nie ma szans na zmianę ich polityki z powodu tej samej domeny. ..

można skalować zawartość Twojego div z reCAPTCHA (<div id="g-recaptcha" ...)

#g-recaptcha { 
    transform: scale(1.42); 
    transform-origin: 0 0 0; 
}