How do I set the width of a textbox when editing a row in a GridView?

Question

I've got a GridView that can be edited. My problem is that when I click Edit, the textbox is too small (the File Name column). It isn't large enough to display its contents, and it isn't as wide as the rest of the column.

How can I make that textbox wider?

---

Here's the ASP code:

<asp:GridView ID="FileGridView" runat="server" AllowPaging="True" OnPageIndexChanging="FileGridView_PageIndexChanging"
    CellPadding="1" CssClass="GridView"  GridLines="Horizontal"
    Width="100%" AutoGenerateColumns="false"
    AutoGenerateEditButton="true"
    OnRowCancelingEdit="GridView_RowCancelingEdit" OnRowEditing="GridView_RowEditing" OnRowUpdating="GridView_RowUpdating"
    >
    <Columns>
        <asp:BoundField DataField="Name" HeaderText="File Name" />
        <asp:BoundField DataField="Length" HeaderText="Size" ReadOnly="true" />
        <asp:BoundField DataField="LastWriteTime" HeaderText="Last Modified" ReadOnly="true" />
    </Columns>
    <RowStyle CssClass="GridViewRow" />
    <EditRowStyle ForeColor="Black" CssClass="GridViewEditRow" />
    <SelectedRowStyle Font-Bold="True" CssClass="GridViewSelectedRow" />
    <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
    <HeaderStyle CssClass="GridViewHeader" ForeColor="White" />
    <AlternatingRowStyle CssClass="GridViewAlternatingRow" />
</asp:GridView>

There's C# code behind this to update the data, and that works just fine. I hope the solution to this is in the ASP, but if the solution requires some C# code, that's OK with me.

Answer 1

You can apply a CSS class to the control like this:

<asp:BoundField DataField="Name" HeaderText="File Name" 
    ControlStyle-CssClass="wide" />

And then set your width in your StyleSheet:

input.wide { width: 100px; }

Answer 2

This should work:

<asp:BoundField DataField="Name" HeaderText="File Name" />
    <controlstyle Width="200">
    </controlstyle>
</asp:BoundField>