2017-11-04 26 views
8

मेरे पास GridView है TemplateField एस के साथ।टेम्पलेट फ़ील्ड के हेडर टेक्स्ट को केंद्रीय रूप से कैसे संरेखित करें?

मैंने टेम्पलेट फ़ील्ड के हेडर टेक्स्ट को केंद्र में संरेखित करने के लिए HeaderStyle-HorizontalAlign="Center" को आजमाया है लेकिन यह काम नहीं कर रहा है।

<asp:TemplateField HeaderText="Events" HeaderStyle-HorizontalAlign="Center" 
    ItemStyle-HorizontalAlign="Center"> 
</asp:TemplateField> 

मैं टेम्पलेट फ़ील्ड के हेडर टेक्स्ट को कैसे संरेखित कर सकता हूं?

जबकि ItemStyle-HorizontalAlign="Center" संरेखण केंद्र टेम्पलेटफ़ाइल के आइटम सही तरीके से काम कर रहे हैं।

किसी भी मदद की वास्तव में सराहना की जाएगी!

उत्तर

1

मैं एक तरीका है कि समस्या जिसमें मैं HeaderTemplate में एक <center> टैग का उपयोग किया हल मिल गया है:

<asp:TemplateField ItemStyle-HorizontalAlign="Center"> 
    <HeaderTemplate> 
     <center> 
      Events 
     </center> 
    </HeaderTemplate> 
<asp:TemplateField> 
2

मैंने अभी एक नया वेबफॉर्म समाधान बनाया है और यह सुनिश्चित करने के लिए बूटस्ट्रैप हटा दिया है कि कोई भी सीएसएस शैलियों मेरे कोड में हस्तक्षेप नहीं करती है। यही वह है जो मैंने आपकी समस्या को पुन: उत्पन्न करने के लिए किया है।

aspx:

<asp:GridView runat="server" ID="grid" Style="width: 500px;"> 
    <Columns> 
     <asp:TemplateField HeaderText="FirstName - TemplateField"> 
      <ItemTemplate> 
       <asp:Label ID="Label1" runat="server" Text='<%# Bind("FirstName") %>'></asp:Label> 
      </ItemTemplate> 
     </asp:TemplateField> 
    </Columns> 

</asp:GridView> 

आप देख सकते हैं, मैं एक TemplateField किसी भी अतिरिक्त सीएसएस शैलियों के बिना परिभाषित किया है।

codebehind:

public partial class _Default : Page 
{ 
    protected void Page_Load(object sender, EventArgs e) 
    { 
     grid.DataSource = GetPersons(); 
     grid.DataBind(); 
    } 

    public IEnumerable<Person> GetPersons() 
    { 
     for(int i = 0; i< 10; i++) 
     { 
      yield return new Person { FirstName = $"John{i}", LastName = "Doe", Age = i }; 
     } 
    } 
} 

मैं सिर्फ 10 डमी आइटम लौटने हूँ एक डेमो ग्रिड बनाने के लिए। असाधारण नहीं।

enter image description here

आप देख सकते हैं, हेडर डिफ़ॉल्ट रूप से केंद्रित होते हैं:

यह क्रोम और इंटरनेट एक्सप्लोरर में परिणाम है। और यह दोनों के लिए है- बाउंडफिल्ड्स और टेम्पलेटेट फ़ील्ड।

यदि यह आपके लिए मामला नहीं है, तो मैं यह जांचने की अनुशंसा करता हूं कि कोई अन्य स्टाइलशीट आपकी शैलियों में हस्तक्षेप कर रही है या नहीं। मुझे लगता है कि बूटस्ट्रैप पता th तत्वों के लिए text-align: center करने के लिए 3 चूक (क्योंकि मैं सिर्फ जाँच)

+0

मेरा प्रश्न है 'हेडर स्टाइल-क्षैतिज अलाइन' काम नहीं कर रहा है। जवाब के लिए धन्यवाद। – AsifAli72090

+0

मैंने पहले ही लिखा है, कि संभवतः एक और शैली इसे ओवरराइड कर रही है। – Marco

+0

मैंने आपके उत्तर के लिए समस्या हल कर ली है! – AsifAli72090

2

सही करके, temStyle-HorizontalAlign = "केंद्र" काम करना चाहिए। बस जागरूक रहें कि आपकी ग्रिडव्यू शैलियों को मूल स्टाइलशीट से विरासत में मिला है। मतलब, आपके ग्रिडव्यू में कम से कम एक मूल शैली है जो सीटर संरेखण नहीं है। यह होना चाहिए कि आपकी समस्या कहां आती है।

5

<center> टैग HTML 4.01 में पदावनत किया गया है और एचटीएमएल 5 में समर्थित नहीं - काम कर कोड तुम्हें तैनात किया जा सकता है "सीएसएस-वर्गीकृत" इस प्रकार है:

<asp:TemplateField ItemStyle-HorizontalAlign="Center"> 
    <HeaderTemplate> 
     <asp:Panel style="margin-left: auto; margin-right: auto; text-align: center;"> 
      Events 
     <asp:Panel> 
    </HeaderTemplate> 
<asp:TemplateField> 

(नोट: Panel ASP.Net बराबर है <div> का।)

यहाँ एक मामूली सुधार शैली के लिए एक सीएसएस वर्ग को परिभाषित करने के लिए तो यह कहीं और पुन: उपयोग किया जा सकता है:

.center { 
    margin-left: auto; 
    margin-right: auto; 
    text-align: center; 
} 

... और पैनल से बजाय संदर्भ इनलाइन शैली का उपयोग करने का:

<asp:Panel CssClass="center"> 
संबंधित मुद्दे

 संबंधित मुद्दे