Ghi đè reCAPTCHA CSS

Question

Tôi đang sử dụng reCAPTCHA và văn bản cho recaptcha_challenge_field đang xuất hiện ở giữa hộp recaptcha chồng lên nhau. Tôi thấy rằng đó là vì phong cách này:

.recaptchatable #recaptcha_response_field { 
    position: absolute!important; 

khi tôi đặt position-static trong Chrome, có vẻ tốt. Tuy nhiên, tôi không thể tìm ra cách ghi đè tùy chọn CSS đó.

tôi đã cố gắng:

• này thêm vào CSS của riêng tôi:

  .recaptchatable #recaptcha_response_field { 
      position: static !important; 
  } 
  

• thêm một entry trong CSS của tôi với tên .recaptcha_text
  • gọi nó qua div class (gói xung quanh textarea)
  • gọi nó qua lớp p (gói xung quanh văn bản)
  • thêm position: static!important; tiêu chuẩn <textarea name="recaptcha_challenge_field" ...> thẻ

Tuy nhiên, tôi không thể có được css của tôi để ghi đè lên vị trí đó: tĩnh quan trọng; mà đi qua với kịch bản:

<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> 

Ai đó có thể giúp tôi với những gì tôi đang làm sai? Cảm ơn bạn!

Answer 1

Từ thử nghiệm ở đây: http://jsbin.com/otihuk/edit#html,live (các kiểm tra dường như chỉ để làm việc trong các trình duyệt WebKit)

này trông giống như một vấn đề CSS đặc hiệu đơn giản. Các reCAPTCHA CSS được nạp sau của bạn, và cả hai bộ chọn của bạn và họ có tính đặc thù ngang nhau (và cả hai đều có !important trong khai báo), và vì vậy vì chúng được chỉ định cuối cùng, nó thắng.

Bạn có thể sửa chữa nó bằng cách chọn của bạn cụ thể hơn họ:

#recaptcha_area #recaptcha_response_field { 
    position: static !important; 
} 

Tôi đã nói thêm rằng trong bản demo của tôi ở trên, và tôi có thể nhìn thấy bằng cách kiểm tra các yếu tố #recaptcha_response_field rằng giá trị tính toán của position tài sản bây giờ thực sự là static.