GridView 修复了 Header 溢出容器答案

【问题标题】：GridView Fixed Header Overflow the ContainerGridView 修复了 Header 溢出容器
【发布时间】：2016-11-14 13:54:55
【问题描述】：

我在 Div 容器中有一个带有冻结标题的 gridview。当 gridview 中的标题列数不超过容器的数量时，它可以正常工作，并且如果我在 gridview 中添加更多标题列，它会溢出 div 容器。

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Test2.aspx.cs" Inherits="Test2" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <style type="text/css">
       .header { position:absolute;  }
   </style>
</head>
<body>
    <form id="form1" runat="server">
   <div style="overflow:scroll; height:250px; width:600px;" >
         <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false"
               CellPadding="4" ForeColor="#333333" Width="600px">
            <Columns>
                <asp:BoundField DataField="Name" HeaderText="Name" HeaderStyle-Width="271px" />
                <asp:BoundField DataField="Branch" HeaderText="Branch" HeaderStyle-Width="91px" />
                <asp:BoundField DataField="City" HeaderText="City" HeaderStyle-Width="194px" />
                 <asp:BoundField DataField="Contact" HeaderText="NewColumn1" HeaderStyle-Width="194px" />
                 <asp:BoundField DataField="Email" HeaderText="NewColumn2" HeaderStyle-Width="194px" />
            </Columns> 
            <HeaderStyle CssClass="header" BackColor="#7961da"
                                                                Font-Bold="True" ForeColor="White" />       
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
         </asp:GridView>
    </div>
    </form>
</body>
</html>

/Aspx.cs 代码/

 protected void Page_Load(object sender, EventArgs e)
{




    DataTable table = new DataTable();
    table.Columns.Add("Name");
    table.Columns.Add("Branch");
    table.Columns.Add("City");
    table.Columns.Add("Contact");
    table.Columns.Add("Email");

    for (int i = 0; i < 80; i++)
    {
        DataRow row1 = table.NewRow();
        List<string> report1 = new List<string>();
        report1.Add("XYZ");
        report1.Add("ABC");
        report1.Add("PQR");
        row1["Name"] = "MyName";
        row1["Branch"] = "MyBrach";
        row1["City"] = "London";
        row1["Contact"] = "NewColumnData1";
        row1["Email"] = "NewColumnData2";


        table.Rows.Add(row1);
    }



    GridView1.DataSource = table;
    GridView1.DataBind();

【问题讨论】：

请张贴 .aspx 标记
亲爱的丹尼斯，我已经更新代码了

标签： c# html css asp.net gridview

【解决方案1】：

请删除所有出现的HeaderStyle-Width="x"，它将不再产生不希望的重叠效果。

【讨论】：