2012-12-07 17 views
5

द्वारा मेरी सामग्री की ऊंचाई को बदलने reCAPTCHA के बिना, मेरा पेज इस तरह दिखता है (jsfiddle):reCAPTCHA के बारे में -20px

<html> 
<body> 

<div class="content_wrap"> 
    <div class="left_container"> 
    </div> 

    <div class="right_container"> 
     <div style="background-color: blue; margin:0px; height: 1500px;"> 
     <!--RECAPTCHA WOULD GO HERE--> 
     </div> 
    </div> 

</div> 

</body> 
</html> 

सीएसएस:

body,html { 
    height: 100%; 
    width: 100%; 
    background-color: #f8f8f8; 
} 

div.content_wrap { 
    width: 100%; 
    position: relative; 
} 

div.left_container { 
    float:left; 
    position:absolute; 
    width: 220px; 
    min-height: 100%; 
    background-color: red; 
} 

div.right_container { 
    position: relative; 
    padding: 0px; 
    margin-left: 220px; 
    width: 1000px; 
} 

reCAPTCHA साथ

(नीले क्षेत्र में) पूरे पृष्ठ की सामग्री की ऊंचाई नीचे सफेद जगह की एक दृश्य पट्टी के साथ ~ 20px से कम हो जाती है।

क्या किसी को भी अपने लेआउट के तत्वों को बदलने में रीकैप्चा के साथ समस्याएं हैं?

+0

reCAPTCHA सामान्य रूप से बहुत विश्वसनीय है। क्या आप लिंक कर सकते हैं जहां आपके पास रीकैप्चा स्थापित के साथ एक वास्तविक वेबपृष्ठ है, (जब तक कि कोई भी नहीं जानता) आप jsfiddle पर काम कर रहे एक पूर्ण संस्करण प्राप्त कर सकते हैं। यदि आप एक या दो घंटे में नहीं देख पा रहे हैं, तो जब मैं किसी पीसी पर हूं तो कोई भी मुझे इसमें धड़कता नहीं है ... –

उत्तर

5

मैं this reCAPTCHA jsfiddle example पर आधारित replicate your issue पर सक्षम हूं।

ऐसा लगता है कि रीकैप्चा पृष्ठ के निचले भाग में जोड़ने के लिए खाली iframe का कारण बनता है।

<iframe src="about:blank" style="height: 0px; width: 0px; visibility: hidden; border: none;"> 
    This frame prevents back/forward cache problems in Safari. 
</iframe> 

iframe परिणाम मुद्दे पर चर्चा का एक बहुत में में संदेश पर एक Google searchRecaptcha creates iFrame on page, breaks styling

नीचे सीएसएस का प्रयास करें::

और यहाँ एक समाधान इतने पर पाया है

/* ReCaptcha Iframe FIX */ 
iframe {display:none !important;} 
header iframe, 
section iframe, 
footer iframe, 
div iframe { display:inline; } 

आप के बारे में चिंता करने के लिए साइट पर किसी भी अन्य फ्रेम, नहीं है, तो एक सरल संस्करण पर्याप्त होना चाहिए:

iframe {display:none !important;} 

अंत में, समाधान के साथ jsfiddle यहां लागू किया गया है: http://jsfiddle.net/BXufS/7/

+0

बहुत अच्छी चीजें, धन्यवाद! – sooper

3

मैं सीएसएस

<iframe src="about:blank" style="height: 0px; width: 0px; visibility: hidden; border: none;"></iframe> 

iframe[src="about:blank"] { display: none; } 
निश्चित रूप से

में आइफ्रेम src विशेषता को लक्षित करके उस समस्या को ठीक मैं about:blank स्रोत के साथ कोई अन्य iframes है;)