यह सीएसएस क्यों नहीं है: पहला बच्चा चयनकर्ता काम करता है?

Question

मैं एक एएसपी.नेट एमवीसी 3 प्रोजेक्ट पर काम कर रहा हूं और एक ईंट की दीवार में भाग गया हूं कि यह ऐसा क्यों नहीं करता है जैसा मुझे लगता है कि इसे करना चाहिए।

मेरे मार्कअप है:

<fieldset> 
    <input type="hidden" value="2"> 
    <div class="editor-label"> 
     <label for="Name"> Name</label> 
    </div> 
    ... 
</fieldset> 

मेरे सीएसएस है:

.display-label, .editor-label 
{ 
    margin: 0.8em 0 0 0; 
    font-weight: bold; 
    display: inline; 
} 

fieldset > div:first-child 
{ 
    margin: 0; 
} 

सभी मैं fieldset में पहली div बनाने के है क्या करना चाहते हैं 0. के अंतर मुझे लगता है कि चयनकर्ता में सोचा है fieldset > div:first-child "फ़ील्ड के पहले बच्चे, जिसका प्रकार एक div है" शैली को शैली लागू करेगा, लेकिन जाहिर है कि कुछ मुझे दूर कर रहा है।

मैंने आईई 9/एफएफ/क्रोम में यह कोशिश की है, इसलिए यह मेरे चयनकर्ताओं के साथ एक पुराना ब्राउज़र गड़बड़ नहीं है।

धन्यवाद।

Answer 1

fieldset > div:first-child का अर्थ है "एक fieldsetअगर यह एक div है की पहले बच्चे तत्व का चयन"।

इसका मतलब यह नहीं है कि fieldset में पहले div का चयन करें "।

इस मामले में पहला बच्चा <input type="hidden" value="2"> है।

HTML को बदलने के बिना div का चयन करने के लिए, आपको fieldset > div:first-of-type का उपयोग करने की आवश्यकता है।

दुर्भाग्य से, :first-child व्यापक रूप से समर्थित है, :first-of-type केवल आईई 9 + और अन्य आधुनिक ब्राउज़रों में काम करता है।

तो, इस मामले में, fieldset > div:first-child का उपयोग जारी रखने के लिए सबसे अच्छा फिक्स है, और बस <input type="hidden" value="2"> को स्थानांतरित करें ताकि यह पहला बच्चा न हो।