css - Nesting <a> element inside Html.LabelFor -


  & lt; div class = "form-group col-sm-5" & gt; @ Html.LabelFor (m = & gt; m.foo) & lt; डेटा-टॉगल = "पॉपओवर" डेटा-सामग्री = "मैं एक पॉपवर हूँ!" href = "#" & gt; & Lt; span class = "glyphicon glyphicon-info-sign" & gt; & lt; / span & gt; & lt; / a & gt; & Lt; / div & gt;  

लेबल तत्व < नीचे नीचे तत्व प्रकट होता है (यानी ग्लिफ़िकोन पॉपवर) लेकिन मैं इसे लेबल के सही तरफ स्थान पर रखना चाहता हूं। & lt; a & gt; अंदर @ Html.LabelFor के घोंसले के शिकार के रूप में इसे पूरा करने का एक तरीका है? ऐसा कुछ होना अच्छा होगा:

  & lt; label = "foo" & gt; मैं लेबल हूँ! & Lt; डेटा-टॉगल = "पॉपओवर" डेटा-सामग्री = "मैं एक पॉपवर हूँ!" href = "#" & gt; & Lt; span class = "glyphicon glyphicon-info-sign" & gt; & lt; / span & gt; & lt; / a & gt; & Lt; / लेबल & gt;  

यदि नहीं, तो क्या मुझे इसके बजाय पोजीशनिंग का उपयोग करना होगा?


संपादित करें : मैंने रामो की सलाह और रोलिंग को समाप्त कर दिया कुछ सरल

  & lt; div वर्ग = "फॉर्म-ग्रुप col-sm-5" & gt; & LT; लेबल & gt; & LT; अवधि & gt; मैं एक ** हार्ड-कोडित ** लेबलफॉर डेटा एनोटेशन हूं! & Lt; / span & gt; & Lt; डेटा-टॉगल = "पॉपओवर" डेटा-सामग्री = "मैं एक पॉपवर हूँ!" href = "#" & gt; & Lt; span class = "glyphicon glyphicon-info-sign" & gt; & lt; / span & gt; & Lt; / a & gt; & Lt; / लेबल & gt; & Lt; / div & gt;  

अभी भी दिलचस्पी है कि अगर एक एमवीसी तरीका है कि Glyphicons को @ Html.LabelFor के साथ मिलना है, लेकिन मेरा प्रश्न इस बिंदु पर अधिक या कम शैक्षणिक है।


संपादित करें # 2 : मैंने एक भी आसान समाधान पाया जो कि आंखों में स्पष्ट है यह तरीका यह सुनिश्चित करने के लिए कि & lt; a & gt; और & lt; span & gt; तत्व उसी पर प्रदर्शित होते हैं, स्थिति निर्धारण (यानी डिस्प्ले: इनलाइन ) का उपयोग करता है लाइन।

  & lt; div class = "col-sm-5 form-group" & gt; @ Html.LabelFor (m = & gt; m.foo, नया {शैली = "प्रदर्शन: इनलाइन;"}) & lt; एक डेटा-टॉगल = "पॉपओवर" डेटा-सामग्री = "मैं एक पॉपवर हूँ!" href = "#" & gt; & Lt; span class = "glyphicon glyphicon-info-sign" & gt; & lt; / span & gt; & lt; / a & gt; & Lt; / div & gt;  

आप एक तालिका का उपयोग कर सकते हैं और ऐसा कुछ करें

 <कोड> & lt; तालिका & gt; & LT; टीआर & gt; & Lt; td & gt; @ Html.LabelFor (m = & gt; m.foo) & lt; / td & gt; & Lt; td & gt; & lt; एक डेटा-टॉगल = "पॉपओवर" डेटा-सामग्री = "मैं एक पॉपवर हूँ!" href = "#" & gt; & Lt; span class = "glyphicon glyphicon-info-sign" & gt; & lt; / span & gt; & lt; / a & gt; & lt; / td & gt; & Lt; / टीआर & gt; & Lt; / तालिका & gt;  

संपादित करें:

एक त्वरित Google खोज मुझे इस परिणाम पर लाया जो आपके लक्ष्य को पूरा करने के लिए सीएसएस का उपयोग करता है

2 संपादित करें:

चूंकि आप तालिकाओं का उपयोग करने के थके हुए हैं इसलिए आप ऐसा कुछ करने में सक्षम हो सकते हैं। मैंने अभी तक कोड का परीक्षण नहीं किया है, लेकिन मुझे विश्वास है कि आपको अपना वांछित व्यवहार देना चाहिए।

HTML:

  & lt; div & gt; & Lt; div वर्ग = "लेबल" & gt; @ Html.LabelFor (m = & gt; m.foo) & lt; / div & gt; & Lt; डेटा-टॉगल = "पॉपओवर" डेटा-सामग्री = "मैं एक पॉपवर हूँ!" href = "#" & gt; & Lt; span class = "glyphicon glyphicon-info-sign" & gt; & lt; / span & gt; & lt; / a & gt; & Lt; / div & gt;  

CSS:

 । लेबल {प्रदर्शन: इनलाइन-ब्लॉक; }  

Comments