<label>

Question

के अंदर HTML टैग्स में मेरे पास एक पृष्ठ में एक सारणी है जिसमें बाईं ओर सेल्स में चेकबॉक्स और दाईं ओर सेल्स में विवरण शामिल हैं। "विवरण" में एच 4 हेडर और सादा पाठ शामिल है। मैं उस पूरे विवरण को बनाना चाहता हूं (<td></td> के अंदर सबकुछ) एक लेबल।

तो प्रत्येक पंक्ति इस तरह दिखता है:

<tr><td><input type="checkbox" name="entiries[]" value="i1" id="i1"></td> 
<td><label for="i1"> 
<h4>Some stuff</h4>more stuff.. 
<h4>Some stuff</h4>more stuff.. 
</label> 
</td></tr> 

हालांकि यह काम नहीं करता है, पाठ एक लेबल तरह काम नहीं करता और क्लिक करने योग्य नहीं है। मैं इसका परीक्षण करने के लिए फ़ायरफ़ॉक्स 3.6 का उपयोग कर रहा हूं। अगर मैं <h4> टैग हटा देता हूं तो यह काम करना शुरू कर देता है, लेकिन यह स्वरूपण को जटिल बनाता है। क्या <h*> टैग्स के बारे में कुछ है जो <label> को सही तरीके से काम करने से रोकता है?

Answer 1

ब्लॉक स्तर तत्व (जिसमें h4 संबंधित है) इनलाइन तत्वों के अंदर अनुमति नहीं है, और अपरिभाषित व्यवहार का कारण बन जाएगा। आप इसके बजाए span तत्वों का उपयोग कर सकते हैं।

Answer 2

केवल inline elements (अन्य लेबल तत्वों को छोड़कर) लेबल तत्वों के अंदर दिखाई दे सकता है।

<!ELEMENT LABEL - - (%inline;)* -(LABEL) -- form field label text --> 

- http://www.w3.org/TR/html4/interact/forms.html#h-17.9.1

यह वहाँ वैसे भी शीर्षकों डाल करने के लिए कोई मतलब नहीं है।

Answer 3

एचटीएमएल में <label> तत्व एक इनलाइन स्तर तत्व है और इसमें ब्लॉक स्तर तत्व नहीं हो सकते हैं।

शायद यह आपके मुद्दों का कारण बन रहा है। वैकल्पिक रूप से आप <h4> के अंदर अपने लेबल डाल सकते हैं:

<tr><td><input type="checkbox" name="entiries[]" value="i1" id="i1"></td> 
<td>< 
<h4><label for="i1">Some stuff</label></h4>more stuff.. 
<h4><label for="i1">Some stuff</label></h4>more stuff.. 
</label> 
</td></tr>