2011 2011 जुलाई 7

सीएसएस हैक का प्रश्न

अगर कुछ ब्लॉग में इस पढ़ें ... सोचा कि यह अच्छा था भविष्य रेफरी के लिए इस सूची ... यह भी एक महत्वपूर्ण साक्षात्कार प्रश्न हो सकता है कि आप कुछ दिन से पूछा होगा सकता है ....

सीएसएस का एक टुकड़ा है कि नए ब्राउज़रों में पुराने ब्राउज़रों में नीले रंग में एक पैरा, लाल प्रदर्शित करने के लिए, हरी जाएगा IE6 और IE7 में काले रंग में लिखें

#content p{color:blue}
html>body #content p {color:red}
* html #content p{color:green}
html>body #content p {*color:black;}


2008 अक्टूबर 10 2008

नहीं केवल आईई के लिए सीएसएस बाल चयनकर्ताओं IE में काम नहीं करते

गैर आईई ब्राउज़र्स के लिए सीएसएस: सीएसएस डेवलपर्स है कि, सीएसएस बाल चयनकर्ताओं, नीचे दिए गए उदाहरण की तरह IE में काम नहीं लगता कोई खबर.

जैसे div> अवधि {कुछ सीएसएस}, इसका मतलब है कि "जब एक अवधि तत्व एक विभाजन तत्व के एक बच्चे (और पोता या नहीं परपोते आदि) है.

लेकिन हम अपने लाभ के लिए इस कांग्रेस का इस्तेमाल किया. ऐतिहासिक, बच्चे चयनकर्ता आईई से सीएसएस commands को छिपाने के लिए इस्तेमाल किया गया है. बस html>body रखकर किसी भी सीएसएस आदेश IE के सामने की अनदेखी करेंगे:

html>body .foo { CSS commands go here ;}

इसका कारण यह है कि काम करता है <body> हमेशा का एक बच्चा है <html> - यह निश्चित रूप से एक या प्रपौत्र पोता कभी नहीं हो सकता है <html> .

अब है कि IE 7 बच्चे चयनकर्ता को समझता है, तो आप सीधे में अधिक से अधिक चिह्न के बाद एक खाली टिप्पणी टैग सम्मिलित है IE 7 तो समझ में नहीं है और इस चयनकर्ता (जो पता नहीं क्यों?) इसलिए पूरी तरह से इस सीएसएस आदेश की अनदेखी करेंगे.

html> /**/ body .foo { CSS commands go here ;}

यदि पहले से ही इन से पहले नहीं देखा है, निम्नलिखित के माध्यम से एक पढ़ने के रूप में अच्छी तरह से है


2008 2008 4 अक्टूबर

इंटरनेट में गायब HTML / DIV तत्व एक्सप्लोरर आईई []

हमेशा की तरह, IE और यह एक आईई Quirks के शीर्ष 10 में स्थान के साथ कई कुछ अजीब समस्याओं में से एक.

समस्या का बयान (यह मेरी समस्या थी, शायद आप समान misbehaviors है):
मैं कई DIV पृष्ठ वर्ग sectionhead ", के साथ जो कुछ भी नहीं है, लेकिन पृष्ठ पर एक वर्ग के शीर्षक में है. तो मैं कुछ शैली इस तरह देख रहा है

Sectionhead {font-size: 18px; पृष्ठभूमि # cfcfcf:; गद्दी: 5px;}.

div कुछ काला पाठ के साथ एक हल्के भूरे रंग की पट्टी है. IE में क्या होता है इन अनुभाग हेडर के कुछ ठीक से प्रदर्शित कर रहे हैं, लेकिन कुछ अदृश्य रहे हैं, जब तक आप पृष्ठ स्क्रॉल या पृष्ठ आदि पर क्लिक करें कुछ कुछ समय वे गायब हो जाते हैं जब आप ऑल्ट कुंजी को क्लिक करें जब आप पृष्ठ नीचे या स्क्रॉल पट्टी के साथ स्क्रॉल. वे कभी कभी फिर से बाहर निकलना जब आप (F5) पृष्ठ पुनः लोड करने लगते हैं. कम एक पूरी तरह से सरल DIV मैं कुछ सरल शैली के साथ बुरा बर्ताव करती है.
क्या इस तरह के एक अनियमित व्यवहार का कारण बन सकता है? अच्छी तरह से! सच कहूँ तो, पता नहीं!

संभव समाधान:
फिर मुझे नहीं पूछ रहे हो, क्यों, लेकिन कई मामलों में इस समस्या जब आप स्थिति को जोड़ने के लिए गायब हो जाता है: तत्वों गलत बर्ताव शैली के सापेक्ष इस तरह,

Sectionhead {font-size: 18px; पृष्ठभूमि # cfcfcf:; गद्दी: 5px; स्थिति: रिश्तेदार}.

अजीब है लेकिन क्या कहना है? भगवान ने मुझे IE से आशीर्वाद!

और अमेरिका के साथ साझा करते हैं, अगर तुम इसी तरह समस्याओं था.


2008 जून 20 2008

रेखा / सूची आइटम में सफेद अंतरिक्ष (ली) बग IE6 में

यदि आप कभी भी बना दिया है (या एक बना) कार्यक्षेत्र मेनू सूची (ली) आइटम टैग और सीएसएस का उपयोग कर, आप मुठभेड़ हो सकता है, यह अभी तक इंटरनेट एक्सप्लोरर, जहां IE सूची आइटम है कि ब्लॉक स्तर तत्व होते हैं के बीच 6 आवेषण इन अंतराल, में एक और बग यानी अगर वहाँ मार्कअप में सूची आइटम्स के बीच कोई खाली स्थान है. धन्यवाद, लेकिन नहीं धन्यवाद, आईई संस्करण 7 इस बग से मुक्त लगता है.
यदि मुझे, और कई और अधिक जैसे, आप निराश डेवलपर्स, जो अभी भी अपने नए लेआउट, IE6 में भी काम मिलता है इस बैंड के हैं, तो यह उपयोगी साबित हो सकता है. एक नजर है ...

नमूना मार्कअप:

<ul id="menu">
<li <a> href="#"> होम </ a> </ li>
<li <a बारे href="#"> </ a> </ li>
<li <a> href="#"> सेवा </ a> </ li>
<li <a पोर्टफोलियो href="#"> </ a> </ li>
<li <a> href="#"> अक्सर पूछे जाने वाले प्रश्न </ a> </ li>
<li <a> href="#"> हमसे संपर्क करें </ a> </ li>
</ Ul>

आप कुछ सीएसएस बनाने के लिए, नीचे एक के समान हो सकता है, एक ऊर्ध्वाधर मेनू में ऊपर मार्कअप transfrom ....

नमूना सीएसएस ...
# मेनू {
मार्जिन: 0; padding: 0; background: # FF9900;
सूची शैली - प्रकार: कोई नहीं; चौड़ाई: 150px;
}
# मेनू ली {:; गद्दी 0 मार्जिन: 0;}
# मेनू {प्रदर्शन: ब्लॉक;
रंग: 555,555 #;
पाठ - सजावट: कोई नहीं;
गद्दी: 0 15px;
रेखा से ऊंचाई: 2.5, सीमा - नीचे: 1px ठोस # FFF;
}

परिणाम आप देखेंगे ...
रिक्त

इस बग (संशोधित / बोल्ड इटैलिक में सीएसएस जोडी) के लिए समाधान

# मेनू {
मार्जिन: 0; padding: 0; पृष्ठभूमि: # FF9900, सूची शैली - प्रकार: कोई नहीं; चौड़ाई: 150px;
फ्लोट: छोड़ दिया; / * इस जारी सूची आइटम * /
}
# मेनू ली {
मार्जिन: 0; padding: 0;
फ्लोट: छोड़ दिया; / * यह फिक्सेस * /
चौड़ाई: 100%; IE6 में / * रहितसफेद बग * /
}
# मेनू {
प्रदर्शन: ब्लॉक; रंग: ५,५५,५५५;
पाठ - सजावट: कोई नहीं;
गद्दी: 0 15px;
रेखा से ऊंचाई: 2.5, सीमा - नीचे: 1px ठोस # FFF;
}

यदि उपरोक्त समाधान doesnot काम करने लगते हैं (केवल IE6 के लिए जाना जाता कारणों के लिए) ... इस विधि बजाय कोशिश

बस अपने मार्कअप करने के लिए इस अतिरिक्त IE6 का केवल शैलियों को जोड़ने ...

<- [लेफ्टिनेंट IE 7>
<style type="text/css">
# मेनू ली एक {प्रदर्शन: इनलाइन ब्लॉक;}
# मेनू ली एक {प्रदर्शन: ब्लॉक;}
</ शैली>
<[Endif] ->


2008 12 Apr 2008

सीएसएस क्रॉस ब्राउज़र न्यूनतम लंबाई हैक

IE 6, MSIE तरह किया गया है काफी कुछ और सीएसएस सबसे अन्य मानक ब्राउज़रों के लिए मानक गुण जोड़कर हमें यूआई डेवलपर्स के लिए. एक "न्यूनतम ऊंचाई में इस तरह के उपयोगी संपत्ति है. सुंदर सीधे आगे संपत्ति है कि कोई घना विवरण की जरूरत है. जब एक विभाजन के लिए न्यूनतम ऊंचाई सेट कर दिया जाता है, यह हमेशा कि सेट ऊंचाई को बरकरार रखे हुए है जब यह सामग्री घरों कम रह रहे हैं की तुलना में यह पकड़ और महत्वपूर्ण बात तराजू (वनीला "ऊंचाई" संपत्ति के विपरीत) या सीएसएस शब्दों में, यह एक तरह बर्ताव करती है जिसका "ऊँचाई" विभाजन "ऑटो" के लिए सेट कर दिया जाता है.

हम में से कुछ गरीब डेवलपर्स, वह भी IE6 में काम करना चाहिए जो अभी भी कोड सीएसएस करने के लिए आवश्यक हैं के लिए, "न्यूनतम ऊंचाई" संयुक्त राष्ट्र की उपलब्धता, एक शो डाट कुछ समय साबित कर सकता था ... donot निराशा.

सौभाग्य से, हम IE में पर्याप्त quirks, कि हम बाहर लाभ का उपयोग करने के लिए और के माध्यम से हमारे रास्ते में हैक करने के लिए हमारे लक्ष्य तक पहुँचने के लिए है ... यानी एक प्रभाग डिवीजन बनाने के रूप में यद्यपि IE6 में न्यूनतम ऊंचाई

समाधान 1: का प्रयोग अधोडैस हैक [ ... और अधिक पढ़ें ]

.box1 {
min-height: 200px;
height:auto;
_height:200px;
}

एचटीएमएल: -
<div class="box1">Some dynamic content with variable height ...</div>


समाधान 2: सीएसएस गुण चयनकर्ता हैक का उपयोग करना

.box2 {
min-height:200px;
height:200px;
}
div[class] .box2 {
height:auto;
}

एचटीएमएल: -
<div class="someclass">
<div class="box2 common">Some dynamic content with variable height ...</div>
</div>

सीएसएस गुण चयनकर्ता हैक ब्राउज़र पहले था IE6 के एक atribute-चयनकर्ता नजरअंदाज कर दिया तथ्य का लाभ लेता है. नोट वर्ग = "someclass" के साथ एक कंटेनर विभाजन की आवश्यकता है. इस विभाजन के लिए वर्ग विशेषता की उपस्थिति, ऊंचाई ओपेरा मोज़िला, और MSIE7 के के लिए ऑटो और बाद में वापस को अध्यारोहित करता है. IE6, जो atribute चयनकर्ताओं का समर्थन नहीं करता है इसे अनदेखा.

IE6 के लिए न्यूनतम ऊंचाई हैक का डेमो देखें



2008 मार्च 15 2008

परेशान पॉपअप प्रभागों के माध्यम से चयन करें बॉक्स दर्शनीय

कई अवसरों पर, जबकि पॉपअप प्रभागों / lightboxes सुझाव / पृष्ठ लेआउट के साथ कर रहे हैं आदि हम स्थितियों में, जहां कुछ फार्म का चयन करें वस्तुओं को इन POPUP प्रभागों के तहत डिजाइन द्वारा, होता है और यह माध्यम से पता चलता है भर में आ ... YUK!!

अच्छी तरह से! आप आसानी से अपने z-सूचकांक मूल्यों एफएफ और IE7 के लिए उचित समायोजन करके ठीक कर सकता है. लेकिन अच्छे पुराने IE6 का व्यवहार नहीं करता है (यमक इच्छित) के रूप में करना .... का चयन करें बॉक्स के माध्यम से दिखाने के लिए, के बाद भी आप अपने पॉपअप डिवीजन ... Bummer! कुछ तेजी से उच्च z-सूचकांक मूल्यों को लागू!

इस समस्या के लिए नहीं सुधार कर रहे हैं, लेकिन वहाँ रहे हैं, मुझे विश्वास है, कुछ काम करने के लिए चारों ओर इस समस्या की तरह, लेकिन मैं यहाँ आप सरल समाधान है कि मैं का उपयोग करें, जो मेरे लिए ठीक काम करता है के अधिकांश में, बता से अधिक मामलों ....

"ROUGE का चयन करें बॉक्स छुपा जब आप POPUP शो"

बस अपनी स्क्रिप्ट टुकड़ा में जहाँ आप अपने पॉपअप दिखा, स्क्रिप्ट का एक टुकड़ा जोड़ने के "छुपे हुए" का चयन करें बॉक्स की दृश्यता सेट

document.getElementById ('my_select) style.visibilty = "छिपी";

और यह अपने पॉपअप डिवीजन के करीब पर वापस सेट याद

document.getElementById ('my_select') = "दिखाई" style.visibilty के;

"my_select" जहां जलन का चयन करें बॉक्स की आईडी है

उम्मीद है कि इस मदद करता है ...

पुनश्च. गतिशील पॉपअप DIV के तहत एक iframe (पॉपअप आप के रूप में एक ही आकार) positionining की तरह बिल्कुल अन्य विकल्प हैं ... यह भी अच्छी तरह से काम करता है, लेकिन डोम तत्वों, स्क्रिप्ट और सिर की पीड़ा के भार की एक अतिरिक्त के साथ. मैं इस समाधान का इस्तेमाल किया है भी, और यदि आप इस विकल्प के साथ किसी भी मदद की ज़रूरत है, मुझे पता है. मदद करने के लिए खुश हो जाएगा!


2008 8 जनवरी 2008

आपके ies Duex केवल भाग के लिए: सशर्त टिप्पणियाँ

कुछ महीने पहले हमने देखा, हम कैसे सीएसएस का एक टुकड़ा है कि केवल IE6 के लिए दिखाई होना होगा (शामिल हो सकते हैं आपके केवल ies के लिए ). इस रूप में अच्छी तरह से प्राप्त करने के अन्य तरीके हैं. बस एक अलग सीएसएस, अपने लक्ष्य आईई के लिए विशिष्ट. यह क्या सशर्त टिप्पणियां रूप में कहा जाता है के साथ प्राप्त किया जा सकता है.

सशर्त टिप्पणियाँ ब्राउज़र का प्रकार और संस्करण का पता लगाने के लिए एक रास्ता है. ब्राउज़र का पता लगाने के लिए सुनिश्चित करें कि सामग्री के विशिष्ट ब्राउज़र के लिए प्रस्तुत किया जाता है. ब्राउज़र का पता लगाने के कई विभिन्न तकनीकों का उपयोग किया जा सकता है. इस विधि पहले के तरीकों पर कई फायदे है, कि शैली जावास्क्रिप्ट का उपयोग कर स्विचन शामिल है. महत्वपूर्ण कुछ सूची, होगा;

  • स्क्रिप्टिंग की आवश्यकता नहीं है
  • क्रॉस - ब्राउज़र

हम यह कैसे करते हो?

केवल IE 5 में कुछ करो
<!--[if IE 5]> Welcome to Internet Explorer 5. <![endif]-->

IE के सभी संस्करणों में कुछ करो
<!--[if IE]>
<link href="css/ie.css" rel="Stylesheet" type="text/css" />
<![endif]-->

सभी IE के नए संस्करण में कुछ करो कि IE 5
<!--[if gte IE 5]>
<script type="text/javascript"><!--
alert("Congratulations! You are running Internet Explorer 5 or greater.");<br />
// --></script>
<![endif]-->

अधिक सशर्त vartiations के लिए, MSDN पर इस जानकारी को पढ़ने:
सशर्त टिप्पणी के बारे में


2007 8 सितम्बर 2007

आपके केवल ies के लिए

यदि आप थोड़ी देर के लिए किया गया है सीएसएस लेखन, आप उन बार अनुभव है जब आप सचमुच अपने बाल खींच जब अपने सीएसएस लेआउट सभी नए ब्राउज़रों (मैं ब्राउज़रों IE6 के तुलना में बाद में मतलब है) में ठीक देखा होगा, लेकिन IE 6 एक गुस्से का आवेश फेंकता है. आप अपने सीएसएस को समायोजित करने के लिए कठिन संघर्ष, लेकिन यह काम नहीं करता ... खैर! इन हैक्स की कोशिश करो ...

1. हैक अधोडैस: -
परिभाषा के अनुसार, सीएसएस 2.1 विनिर्देश को रेखांकित में सीएसएस पहचानकर्ता ("_") की अनुमति देता है. लेकिन कई ब्राउज़रों अभी भी किसी भी एक के साथ रवाना पहचानती है उपेक्षा को रेखांकित लेकिन आईई लगते हैं. इस आईई बग / सुविधा इस प्रकार ies के लिए सीएसएस गुण सेट केवल एक बहुत स्पष्ट हो जाता है. इतना याद है, एक सीएसएस संपत्ति के साथ शुरू पर अधोडैस लिखा है इंटरनेट एक्सप्लोरर (सभी संस्करणों लेकिन IE 7) के लिए दिखाई देता है

#box {
min-height: 300px;
height: auto;
_height: 300px; /* all IE versions less than version 7 */
...
}

इस के दृश्य प्रदर्शन हैक अधोडैस

इसके अलावा, IE6 के लिए न्यूनतम ऊंचाई हैक हैक अधोडैस का उपयोग करता है, बाहर की जाँच करें


2. हैश (#) हैक: -
तरह हैक अधोडैस, यह एक है एँ oly के लिए है एक अच्छा अंतर के साथ,, संपत्ति # साथ शुरू पर पहले पहचानकर्ता सभी IE के संस्करणों के लिए दिखाई है, IE7 के शामिल है और किसी भी अन्य मानक ब्राउज़र के लिए अदृश्य है.

.obj_container {
display: table-cell;
vertical-align: middle;
#position: absolute; /* For IE only */
#top: 50%; /* For IE only */
#left:50%; /* For IE only */
}

यह हैक अच्छी तरह से इस्तेमाल किया गया है ऊर्ध्वाधर समाधान संरेखित करने के लिए एक पार ब्राउज़र का प्रदर्शन, इस लेख पर एक नज़र है हमारे अधिक जानकारी प्राप्त


3. IE6 के लिए केवल सीएसएस: -
#my_bad_behaving_div {
/*something for all browsers*/
}
/* Lets use the * html hack so only IE6 reads the rule */
* html #my_bad_behaving_div{
/*something for IE6 only*/
}

इन हैक्स लगता है स्वर्ग भेजा है, जब कुछ नहीं काम करता है ... अगर इन hacks के किसी किसी दिन आपके जीवन बचाता है, मुझे एक कॉफी :) इलाज को भूल जाओ


2007 जुलाई 12 2007

Mouseover घटना IE में एक पारदर्शी प्रभाग में

मैं इस समस्या है जहां, अगर आप (DIV) विभाजन और उस विभाजन पर एक mouseover घटना थी, कुछ अच्छे कारण के लिए पारदर्शी किया जा सकता था (के रूप में मेरे मामले में, जहां यह के mouseover पर एक छवि पर कुछ टैग प्रदर्शित करने के लिए आवश्यक था था इस पारदर्शी प्रभाग), IE के mouseover घटना (फ़ायर्फ़ॉक्स में काम ठीक) को गति प्रदान करने में विफल रहा है.

की कोशिश की कई विकल्प है ... जिसमें से कई सिर्फ एक हताश घटना IE में आग का प्रयास किया गया. समझदार हैं, कि मैंने सोचा कि हो सकता है काम के विभाजन के लिए एक पृष्ठभूमि रंग सेट और शून्य करने के लिए मत पारदर्श सेट किया गया था ... खैर! काम के सहारे!

अंतिम समाधान है जो काम करने के लिए लग रहा था और मैं की आवश्यकता कार्यक्षमता परेशान नहीं करने के लिए एक पिक्सेल दोहराया / पारदर्शी पृष्ठभूमि छवि है कि विभाजन में डाल दिया गया था

... बेवकूफ! लेकिन अब आईई खुश लगता है.


2007 जून 11 2007

जारी तत्वों में IE6 का डबल मार्जिन बग

सरल ... इस समस्या का उपयोग प्रदर्शन सही: इनलाइन.

div {float:left;margin:40px;display:inline;}

यदि आप एक div के रूप में जारी तत्व है और आप मार्जिन - सही या कि तत्व पर मार्जिन - बाएँ जगह है, इंटरनेट एक्सप्लोरर 6.0 कि मार्जिन मूल्य दोगुना, html / सीएसएस लेआउट खिलवाड़. इसे ठीक करने के लिए केवल प्रदर्शन जोड़ें: इनलाइन, अपने अस्थायी तत्व के लिए.


NDK घर | आईटी व्यक्त | व्यक्त तालु | व्यक्त Penmenship | श्रद्धा व्यक्त | अपने आप को व्यक्त