Как настроить таргетинг и стилизацию Google recaptcha с помощью css? - PullRequest
Новая
       10

Как настроить таргетинг и стилизацию Google recaptcha с помощью css?

2 голосов
/ 19 мая 2019

Я пытаюсь отрегулировать длину и расположение моей Google recaptcha, но если я использую div, он не работает, если я использую класс, он не работает. 

.anr_captcha_field {width: 100px}

Также пробовал: 

wpcf7-form-control-wrap g- 
recaptcha- 
response {width: 100px}

Html 

<span class="wpcf7-form-control- 
wrap your-message"><textarea 
name="your-message" cols="40" 
rows="10" class="wpcf7-form-control 
wpcf7-textarea" aria- 
invalid="false"></textarea></span> 
</label></p>
<p><div class="anr_captcha_field">. 
<div id="anr_captcha_field_1" 
class="anr_captcha_field_div">. 
</div></div><span class="wpcf7- 
form-control-wrap g-recaptcha- 
response"></span></p>
<p><input type="submit" 
value="Send" class="wpcf7-form- 
control wpcf7-submit" /></p>

Страница: https://adsler.co.uk/contact-us/

Ответы [ 3 ]

0 голосов
/ 19 мая 2019

Google reCAPTCHA находится в iFrame.Вы должны проверить, как изменить стиль iFrame.Проверить: Как применить CSS к iframe?

0 голосов
/ 21 мая 2019

Я почти уверен, что вы хотите, чтобы это было так же, как и в других ваших областях. попробуйте следующий css, дайте мне знать, если это работает. 

#anr_captcha_field_1 {
    width: 310px;
    overflow: hidden;
    border-radius: 20px;
    transform: scale(0.9);
    transform-origin: left top;
    background: #f9f9f9;
}
0 голосов
/ 19 мая 2019

Используя свойство CSS transform, вы можете добиться изменения ширины, изменив весь масштаб reCAPTCHA.

Пример:

transform: scale (0.77)

...