html - Gridview 上的列宽在编辑模式下不换行

Question

问题:Gridview 上的列宽在编辑模式下未换行

“预览”上的标题在适合 1000 像素宽的整齐列中显示标题文本。我一按编辑，表格就会扩大到这个大小。

如何在编辑 View 中强制表格的最大尺寸？

代码:CSS/VB.net

.aspx 页面

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" Width="1000px"
    AllowPaging="True" AllowSorting="True" CssClass="mGrid" PagerStyle-CssClass="pgr"
    EmptyDataText="There are no data records to display - Please change your search."
    DataKeyNames="EmployeeID" AlternatingRowStyle-CssClass="alt" DataSourceID="SqlDataSource1"
    EnableViewState="true" EnableModelValidation="True" >
    <AlternatingRowStyle CssClass="alt"  />

示例字段:

<asp:TemplateField HeaderText="Login Name" SortExpression="UserName">
 <ItemTemplate>                   
  <%# Eval("UserName") %>
 </ItemTemplate>
 <EditItemTemplate>
   <asp:TextBox ID="txtUserName" runat="server" Text='<%# Bind("UserName") %>'/>
 </EditItemTemplate>
</asp:TemplateField>

CSS(还有更多，但我相信这是我需要看的地方)

在我看来，100% 相当于网格中引用的 1000 像素的 100%，因为在我单击“编辑”之前它是有效的。

.gridview { 
        font-family:"arial"; 
        background-color:#002649; 
        width: 100%; 
        font-size: small; 
        color: #658654;       
        table-layout:fixed;

} 

Answer 1

在 ItemStyle 中设置 GridView 列的宽度以及 TextBox 的宽度。例如

<asp:TemplateField HeaderText="Login Name" SortExpression="UserName">
     <ItemTemplate>                   
          <%# Eval("UserName") %>
     </ItemTemplate>
     <EditItemTemplate>
          <asp:TextBox ID="txtUserName" runat="server" width="200px" Text='<%# Bind("UserName") %>'/>
     </EditItemTemplate>
     <ItemStyle width="200px"> </ItemStyle>
</asp:TemplateField>