Кнопки перепросмотра некрасивые, исправить не могу

0

Прежде всего, я просто хочу, чтобы вы знали, что я действительно проверил вопрос "Recaptcha is broken", когда решение их проблемы устанавливало высоту линии до 0. Это, к сожалению, мне не помогает.

Я внедрил Google потрясающий Recaptcha на моем веб-сайте, но есть эта проблема; Кнопки имеют белое пространство над ними и под ними, и поэтому есть такая уродливая графическая рамка под моим окном Recaptcha. Проверьте изображение ниже. Я проверил исходный код в браузере, и кажется, что он генерирует iFrame, что означает, что я, очевидно, не могу повлиять на стиль. WTF?

Изображение 174551

  • 0
    Использовали ли вы инструмент разработчика (Firebug для Firefox или F12 для Chome / IE), чтобы узнать, наследуется ли какой-либо из ваших CSS?
  • 1
    Кроме того, я использую reCaptcha от Google в своих системах ASP.NET, и он не использует iFrame , поэтому может легко выбирать унаследованные стили
Показать ещё 2 комментария
Теги:
recaptcha

1 ответ

2

Вы можете настроить стилизацию рекапчи самостоятельно, в соответствии с документацией. Цитировать прямо из статьи:

Чтобы реализовать все это, сначала разместите следующий код на своей основной HTML-странице где-нибудь перед элементом, где появляется reCAPTCHA:

<script type="text/javascript">
  var RecaptchaOptions = {
    theme : 'custom',
    custom_theme_widget: 'recaptcha_widget'
 };

Затем внутри элемента, где вы хотите, чтобы reCAPTCHA отображалась, поместите:

<div id="recaptcha_widget" style="display:none">

  <div id="recaptcha_image"></div>
   <div class="recaptcha_only_if_incorrect_sol" style="color:red">Incorrect please try again</div>

  <span class="recaptcha_only_if_image">Enter the words above:</span>
   <span class="recaptcha_only_if_audio">Enter the numbers you hear:</span>

  <input type="text" id="recaptcha_response_field" name="recaptcha_response_field" />

  <div><a href="javascript:Recaptcha.reload()">Get another CAPTCHA</a></div>
   <div class="recaptcha_only_if_image"><a href="javascript:Recaptcha.switch_type('audio')">Get an audio CAPTCHA</a></div>
   <div class="recaptcha_only_if_audio"><a href="javascript:Recaptcha.switch_type('image')">Get an image CAPTCHA</a></div>

  <div><a href="javascript:Recaptcha.showhelp()">Help</a></div>

</div>

<script type="text/javascript"
    src="http://www.google.com/recaptcha/api/challenge?k=your_public_key">
 </script>
 <noscript>
   <iframe src="http://www.google.com/recaptcha/api/noscript?k=your_public_key"
        height="300" width="500" frameborder="0"></iframe><br>
   <textarea name="recaptcha_challenge_field" rows="3" cols="40">
   </textarea>
   <input type="hidden" name="recaptcha_response_field"
        value="manual_challenge">
 </noscript>
  • 0
    Это все хорошо, но скорее всего в OP есть CSS, который мы не видим, что нарушает версию виджета по умолчанию. Ваше решение состоит в том, чтобы практически заново изобрести колесо, когда все, что ему нужно сделать, это осмотреть шину. (И вам не нужно было переиздавать документ ... простой комментарий к OP сработал бы так же хорошо.)
  • 0
    @ Sparky - я признаю это; мой ответ был в основном дан на вопрос « … что означает, что я, очевидно, не могу повлиять на стиль ». Мы также не знаем, в каком браузере это происходит; это может правильно отображаться на других. Это, однако, перемещает управление его отображением к управлению запрашивающего.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню