How to set width of columns Gridview

Question

See below is my two gridviews.

enter image description here

Below is the code of both gridviews.

First GridView:

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="White"
    BorderColor="#336666" BorderStyle="Double" BorderWidth="3px" CellPadding="4"
    EnableModelValidation="True" GridLines="Horizontal" CssClass="mGrid" ShowFooter="True"
    OnRowDataBound="GridView1_RowDataBound" OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
    <Columns>
        <asp:BoundField DataField="SFTI_Name" HeaderText="SFTI">
            <ItemStyle Width="80px" />
        </asp:BoundField>
        <asp:TemplateField HeaderText="Sanctioned  Budget">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblSanctionedDPR" Text='<%#CheckNull(String.Format("{0:N}", Eval("Sanctioned_DPR")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblSanctioned_DPR" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Contract Budget">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblSanctionedContract" Text='<%#CheckNull(String.Format("{0:N}", Eval("Sanctioned_Contract")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblSanctioned_Contract" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCEligibleExp" Text='<%#CheckNull(String.Format("{0:N}", Eval("C_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblC_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Non-Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCNonEligible_Exp" Text='<%#CheckNull(String.Format("{0:N}", Eval("C_Non_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblC_Non_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Total">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCTotal" Text='<%#CheckNull(String.Format("{0:N}", Eval("C_Total")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblC_Total" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblPEligibleExp" Text='<%#CheckNull(String.Format("{0:N}", Eval("P_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblP_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Non-Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblPNonEligible_Exp" Text='<%#CheckNull(String.Format("{0:N}", Eval("P_Non_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblP_Non_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Total">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblPTotal" Text='<%#CheckNull(String.Format("{0:N}", Eval("P_Total")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblP_Total" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCPEligible_Exp" Text='<%#CheckNull(String.Format("{0:N}", Eval("CP_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblCP_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Non-Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCPNonEligible_Exp" Text='<%#CheckNull(String.Format("{0:N}", Eval("CP_Non_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblCP_Non_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Total">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCPTotal" Text='<%#CheckNull(String.Format("{0:N}", Eval("CP_Total")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblCP_Total" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
    </Columns>
    <FooterStyle BackColor="White" ForeColor="#333333" />
    <HeaderStyle BackColor="#336666" Font-Bold="True" ForeColor="White" HorizontalAlign="Left" />
    <PagerStyle BackColor="#336666" ForeColor="White" HorizontalAlign="Center" />
    <RowStyle BackColor="White" ForeColor="#333333" />
    <SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
</asp:GridView>

Second Gridview:

<asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" BackColor="White"
    BorderColor="#336666" BorderStyle="Double" BorderWidth="3px" CellPadding="4"
    EnableModelValidation="True" GridLines="Horizontal" CssClass="mGrid" ShowFooter="True"
    OnRowDataBound="GridView2_RowDataBound">
    <Columns>
        <asp:BoundField DataField="SFTI_Name" HeaderText="SFTI">
            <ItemStyle Width="80px" />
        </asp:BoundField>
        <asp:TemplateField HeaderText="Sanctioned  Budget">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblSanctionedDPR" Text='<%#CheckNull(String.Format("{0:N}", Eval("Sanctioned_DPR")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblSanctioned_DPR" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Contract Budget">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblSanctionedContract" Text='<%#CheckNull(String.Format("{0:N}", Eval("Sanctioned_Contract")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblSanctioned_Contract" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCEligibleExp" Text='<%#CheckNull(String.Format("{0:N}", Eval("C_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblC_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Non-Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCNonEligible_Exp" Text='<%#CheckNull(String.Format("{0:N}", Eval("C_Non_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblC_Non_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Total">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCTotal" Text='<%#CheckNull(String.Format("{0:N}", Eval("C_Total")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblC_Total" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblPEligibleExp" Text='<%#CheckNull(String.Format("{0:N}", Eval("P_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblP_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Non-Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblPNonEligible_Exp" Text='<%#CheckNull(String.Format("{0:N}", Eval("P_Non_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblP_Non_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Total">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblPTotal" Text='<%#CheckNull(String.Format("{0:N}", Eval("P_Total")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblP_Total" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCPEligible_Exp" Text='<%#CheckNull(String.Format("{0:N}", Eval("CP_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblCP_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Non-Eligible">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCPNonEligible_Exp" Text='<%#CheckNull(String.Format("{0:N}", Eval("CP_Non_Eligible_Exp")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblCP_Non_Eligible_Exp" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Total">
            <ItemTemplate>
                <asp:Label runat="server" ID="lblCPTotal" Text='<%#CheckNull(String.Format("{0:N}", Eval("CP_Total")))  %>'></asp:Label>
            </ItemTemplate>
            <FooterTemplate>
                <asp:Label ID="lblCP_Total" DataFormatString="{0:N}" runat="server" Font-Bold="true"></asp:Label>
            </FooterTemplate>
            <FooterStyle HorizontalAlign="Right" />
            <HeaderStyle HorizontalAlign="Right" />
            <ItemStyle HorizontalAlign="Right" VerticalAlign="Top" Wrap="False" Width="80px" />
        </asp:TemplateField>
    </Columns>
    <FooterStyle BackColor="White" ForeColor="#333333" />
    <HeaderStyle BackColor="#336666" Font-Bold="True" ForeColor="White" HorizontalAlign="Left" />
    <PagerStyle BackColor="#336666" ForeColor="White" HorizontalAlign="Center" />
    <RowStyle BackColor="White" ForeColor="#333333" />
    <SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
</asp:GridView>

I have set every colums's width to 80px. But you can see both are with different width. I like to format those like all 12 colums of second gridview should comes under the same columns as the first gridview have. because the frist gridview is having large amount so the colums expands, but the second gridview having less amount so it is not expanding accordingly to the first one.

how can I do that.

Are you able to recreate this issue in http://jsfiddle.net – Surjith S M Jan 02 '14 at 11:14 — Surjith S M, Jan 02 '14 at 11:14

Miank · Answer 1 · 2014-01-06T08:57:44.377

0

This can help you, even i suffered the same problem the grid-view was going out of the screen.

http://www.codeproject.com/Tips/385449/Docking-a-GridView-and-add-a-horizontal-scrollbar

<asp:Panel ID="panel02" ScrollBars="Horizontal" runat="server" Width="100%" Visible ="false">

edited Jan 06 '14 at 08:57

answered Jan 06 '14 at 08:09

Miank

105
3
13

How to set width of columns Gridview

1 Answers1