title: Change Gridview column widths dynamically in edit mode
body: <p>I have a gridview that can have 1 or 2 controls displayed in 1 column when in edit mode depending on the selection of a dropdown in another column.  One control is a textbox the other a label.  I have the textbox first and the label beside the textbox after it. My problem is when the textbox and label are showing, the label's text extends into the next column.  I would like the column width to be as wide as the controls displayed. 
  How can I do this?</p>
  
  <p>This is my markup for the grid:</p>
  
  <pre><code>&lt;div id="DeviceGridWrapper"&gt;        
      &lt;asp:TextBox ID="RecipientID" runat="server" Visible="false"&gt; &lt;/asp:TextBox&gt;
      &lt;asp:GridView ID="DeviceInfoGridView" runat="server" 
          AutoGenerateColumns="False" Caption="Device Information" 
          CaptionAlign="Top" CssClass="grid" RowStyle-Wrap="true" 
          HorizontalAlign="Left" ShowFooter="True" PageSize="5" 
          ShowHeaderWhenEmpty="False" 
          OnRowCancelingEdit="DeviceInfoGridView_RowCancelingEdit" 
          OnRowDataBound="DeviceInfoGridView_RowDataBound"
          OnRowDeleting="DeviceInfoGridView_RowDeleting" 
          OnRowEditing="DeviceInfoGridView_RowEditing" 
          OnRowUpdating="DeviceInfoGridView_RowUpdating" AllowPaging="True" 
          ondatabound="DeviceInfoGridView_DataBound" 
          onrowcommand="DeviceInfoGridView_RowCommand"&gt;      
          &lt;Columns&gt;
              &lt;asp:TemplateField HeaderText="Device ID"&gt;
                  &lt;ItemTemplate&gt;
                      &lt;asp:Label ID="digvLblDeviceID" runat="server" Text='&lt;%# Bind("DeviceID") %&gt;'&gt;&lt;/asp:Label&gt;
                  &lt;/ItemTemplate&gt;
              &lt;/asp:TemplateField&gt;
  
              &lt;asp:TemplateField HeaderText="Device"  ItemStyle-Wrap="false"&gt;
                   &lt;ItemTemplate&gt;
                      &lt;asp:Label ID="digvLblDeviceName" runat="server" Text='&lt;%# Bind("DeviceName") %&gt;'&gt;&lt;/asp:Label&gt;
                  &lt;/ItemTemplate&gt;
                  &lt;EditItemTemplate&gt;
                      &lt;asp:Label ID="digvEditDeviceName" runat="server" Visible="false" Text='&lt;%# Bind("DeviceName") %&gt;'&gt;&lt;/asp:Label&gt;
                      &lt;asp:DropDownList ID="digvDDListDeviceName" runat="server" ClientIDMode="Static"
                              data-placeholder="Choose device…" class="chosen-single"&gt;&lt;/asp:DropDownList&gt;
                      &lt;asp:RequiredFieldValidator ID="ReqValueDDLDeviceNameEdit" runat="server"  
                              ControlToValidate="digvDDListDeviceName" ValidationGroup="EditDeviceValidation" 
                              ErrorMessage="Selection required." CssClass="message-error-dropdown"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;
                  &lt;/EditItemTemplate&gt;
                  &lt;FooterTemplate&gt;
                      &lt;asp:DropDownList ID="digvDDListDeviceNameInsert" runat="server" ClientIDMode="Static"
                               data-placeholder="Choose device…" class="chosen-single"&gt;
                      &lt;/asp:DropDownList&gt;
                      &lt;asp:RequiredFieldValidator ID="ReqValueDDLDeviceNameInsert" runat="server" InitialValue="0" 
                              ControlToValidate="digvDDListDeviceNameInsert" ValidationGroup="InsertDeviceValidation" 
                              ErrorMessage="Selection required." CssClass="message-error-dropdown"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;
                  &lt;/FooterTemplate&gt;
              &lt;/asp:TemplateField&gt;
  
              &lt;asp:TemplateField HeaderText="Service Provider"&gt;                  
                  &lt;ItemTemplate&gt;
                      &lt;asp:Label ID="digvLblServiceName" runat="server" Text='&lt;%# Bind("ServiceName") %&gt;'&gt;&lt;/asp:Label&gt;
                  &lt;/ItemTemplate&gt;
                  &lt;EditItemTemplate&gt;
                      &lt;asp:Label ID="digvEditServiceName" runat="server" Visible="false" Text='&lt;%# Bind("ServiceName") %&gt;'&gt;&lt;/asp:Label&gt;
                      &lt;asp:DropDownList ID="digvDDListServiceName" runat="server" ClientIDMode="Static" 
                              OnSelectedIndexChanged="DeviceInfoGridView_SelectedIndexChanged_EditServiceName" AutoPostBack="true" EnableViewState="true" 
                              data-placeholder="Choose service…" class="chosen-single"&gt;&lt;/asp:DropDownList&gt;
                       &lt;asp:RequiredFieldValidator ID="ReqValueDDLServiceNameEdit" runat="server" 
                              ControlToValidate="digvDDListServiceName" ValidationGroup="EditDeviceValidation" 
                              ErrorMessage="Selection required." CssClass="message-error-dropdown"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;
                  &lt;/EditItemTemplate&gt;
                  &lt;FooterTemplate&gt;
                      &lt;asp:DropDownList ID="digvDDListServiceNameInsert" runat="server" ClientIDMode="Static" Enabled="false"
                               data-placeholder="Choose service…" class="chosen-single"&gt;
                      &lt;/asp:DropDownList&gt;
                      &lt;asp:RequiredFieldValidator ID="ReqValueDDLServiceNameInsert" runat="server" InitialValue="0" 
                              ControlToValidate="digvDDListServiceNameInsert" ValidationGroup="InsertDeviceValidation" 
                              ErrorMessage="Selection required." CssClass="message-error-dropdown"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;
                  &lt;/FooterTemplate&gt;
              &lt;/asp:TemplateField&gt;
  
              &lt;asp:TemplateField HeaderText="Address"&gt;                 
                  &lt;ItemTemplate&gt;
                      &lt;asp:Label ID="digvLblAddress" runat="server" Text='&lt;%# Bind("Address") %&gt;'&gt;&lt;/asp:Label&gt;
                  &lt;/ItemTemplate&gt;
                   &lt;EditItemTemplate&gt;                       
                      &lt;asp:TextBox ID="digvTxtBoxAddress" runat="server" Text='&lt;%# Bind("Address") %&gt;' Width="50%" ClientIDMode="Static"&gt;&lt;/asp:TextBox&gt;
                      &lt;asp:Label ID="digvEditAddressExt" runat="server" Visible="false" Text='&lt;%# Bind("ServiceExtension") %&gt;' Width="40%" 
                          ClientIDMode="Static"&gt;&lt;/asp:Label&gt;
                      &lt;asp:RequiredFieldValidator ID="ReqValueAddressEdit" runat="server" 
                              ControlToValidate="digvTxtBoxAddress" ValidationGroup="EditDeviceValidation" 
                              ErrorMessage="Required field." CssClass="message-error"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;
                      &lt;asp:CustomValidator ID="CustomValAddressEdit" runat="server" ControlToValidate="digvTxtBoxAddress" CssClass="message-error" 
                          ErrorMessage="*" ClientValidationFunction="ValidateAddressEdit" EnableClientScript="true" 
                          ValidationGroup="EditDeviceValidation"  &gt;&lt;/asp:CustomValidator&gt;
                  &lt;/EditItemTemplate&gt;
                  &lt;FooterTemplate&gt;
                      &lt;asp:TextBox ID="digvTxtBoxAddressInsert" runat="server" ClientIDMode="Static"&gt;&lt;/asp:TextBox&gt;
                      &lt;asp:RequiredFieldValidator ID="ReqValueAddressInsert" runat="server" 
                              ControlToValidate="digvTxtBoxAddressInsert" ValidationGroup="InsertDeviceValidation" 
                              ErrorMessage="Required field." CssClass="message-error"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;
                  &lt;/FooterTemplate&gt;
              &lt;/asp:TemplateField&gt;
  
              &lt;asp:TemplateField HeaderText="Active"&gt;                   
                  &lt;ItemTemplate&gt;
                      &lt;asp:Label ID="digvLblActive" runat="server" Text='&lt;%# (Boolean.Parse(Eval("Active").ToString())) ? "Yes" : "No" %&gt;'&gt;&lt;/asp:Label&gt;
                  &lt;/ItemTemplate&gt;
                  &lt;EditItemTemplate&gt;
                      &lt;asp:DropDownList ID="digvDDListActive" runat="server"  Text='&lt;%# (Boolean.Parse(Eval("Active").ToString())) ? "Yes" : "No" %&gt;'&gt;
                          &lt;asp:ListItem&gt;Yes&lt;/asp:ListItem&gt;
                          &lt;asp:ListItem&gt;No&lt;/asp:ListItem&gt;
                      &lt;/asp:DropDownList&gt;
                  &lt;/EditItemTemplate&gt;
                  &lt;FooterTemplate&gt;
                       &lt;asp:DropDownList ID="digvDDListActiveInsert" runat="server"&gt;
                          &lt;asp:ListItem Selected="True"&gt;Yes&lt;/asp:ListItem&gt;
                          &lt;asp:ListItem&gt;No&lt;/asp:ListItem&gt;
                      &lt;/asp:DropDownList&gt;
                  &lt;/FooterTemplate&gt;
              &lt;/asp:TemplateField&gt;
  
              &lt;asp:TemplateField HeaderText="Action" ShowHeader="False" ItemStyle-Wrap="false" ItemStyle-HorizontalAlign="Center"&gt;
                  &lt;ItemTemplate&gt;
                      &lt;asp:Button ID="digvEditButton" runat="server" CausesValidation="True" CommandName="Edit" 
                                  Text="Edit" CssClass="gridActionbutton" ValidationGroup="EditDeviceValidation"&gt;
                      &lt;/asp:Button&gt;
                      &amp;nbsp;&lt;asp:Button ID="digvDeleteButton" runat="server" CausesValidation="False" CommandName="Delete" 
                                  Text="Delete" CssClass="gridActionbutton"  OnClientClick="return confirm('Are you sure you want to delete this Device Information?')" &gt;
                      &lt;/asp:Button&gt;
                  &lt;/ItemTemplate&gt;
                  &lt;EditItemTemplate&gt;
                      &lt;asp:Button ID="digvUpdateButton" runat="server" CausesValidation="True" ValidationGroup="EditDeviceValidation" CommandName="Update" 
                                      Text="Update" CssClass="gridActionbutton"&gt;&lt;/asp:Button&gt;
                      &amp;nbsp;&lt;asp:Button ID="uigvCancelButton" runat="server" CausesValidation="False" CommandName="Cancel" 
                                      Text="Cancel" CssClass="gridActionbutton"&gt;&lt;/asp:Button&gt;
                  &lt;/EditItemTemplate&gt; 
                  &lt;FooterTemplate&gt;
                      &lt;asp:Button ID="digvAddButton" runat="server" CommandName="Add" Text="Add Device" Width="90%" CausesValidation="true" 
                                  CssClass="gridActionbutton" ValidationGroup="InsertDeviceValidation"&gt;
                      &lt;/asp:Button&gt;
                  &lt;/FooterTemplate&gt;                   
              &lt;/asp:TemplateField&gt;
          &lt;/Columns&gt;
          &lt;EmptyDataTemplate&gt;
              &lt;tr&gt;
                  &lt;th&gt;Device ID&lt;/th&gt;
                  &lt;th&gt;Device&lt;/th&gt;
                  &lt;th&gt;Service Provider&lt;/th&gt;
                  &lt;th&gt;Address&lt;/th&gt;
                  &lt;th&gt;Active&lt;/th&gt;
                  &lt;th&gt;Action&lt;/th&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td colspan="7" style="text-align:center;"&gt;
                      No Devices were found for you. Devices can be added by clicking the 'Add Device' Button.
                  &lt;/td&gt; 
              &lt;/tr&gt;
              &lt;tr&gt;
                  &lt;td&gt;&lt;/td&gt;
                  &lt;td&gt;
                      &lt;asp:DropDownList ID="digvDDListDeviceNameInsert" runat="server" ClientIDMode="Static"
                               data-placeholder="Choose device…" class="chosen-single"&gt;
                      &lt;/asp:DropDownList&gt;    
                       &lt;asp:RequiredFieldValidator ID="ReqValueDDLDeviceNameEmpty" runat="server" InitialValue="0" 
                              ControlToValidate="digvDDListDeviceNameInsert" ValidationGroup="InsertDeviceValidationEmpty" 
                              ErrorMessage="Selection required." CssClass="message-error-dropdown"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;   
                  &lt;/td&gt;
                  &lt;td&gt;
                       &lt;asp:DropDownList ID="digvDDListServiceNameInsert" runat="server" ClientIDMode="Static" Enabled="false"
                               data-placeholder="Choose service…" class="chosen-single"&gt;
                      &lt;/asp:DropDownList&gt;
                       &lt;asp:RequiredFieldValidator ID="ReqValueDDLServiceNameEmpty" runat="server" InitialValue="0" 
                              ControlToValidate="digvDDListServiceNameInsert" ValidationGroup="InsertDeviceValidationEmpty" 
                              ErrorMessage="Selection required." CssClass="message-error-dropdown"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;    
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;asp:TextBox ID="digvTxtBoxAddressInsert" runat="server" ClientIDMode="Static"&gt;&lt;/asp:TextBox&gt; 
                      &lt;asp:RequiredFieldValidator ID="ReqValueAddressEmpty" runat="server" 
                              ControlToValidate="digvTxtBoxAddressInsert" ValidationGroup="InsertDeviceValidationEmpty" 
                              ErrorMessage="Required field." CssClass="message-error"&gt;
                      &lt;/asp:RequiredFieldValidator&gt;   
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;asp:DropDownList ID="digvDDListActiveInsert" runat="server"&gt;
                          &lt;asp:ListItem Selected="True"&gt;Yes&lt;/asp:ListItem&gt;
                          &lt;asp:ListItem&gt;No&lt;/asp:ListItem&gt;
                      &lt;/asp:DropDownList&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                      &lt;asp:Button ID="digvAddButtonEmpty" runat="server" CommandName="Add" Text="Add Device" Width="90%" CausesValidation="true" 
                          CssClass="gridActionbutton" ValidationGroup="InsertDeviceValidationEmpty"&gt;
                      &lt;/asp:Button&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;/EmptyDataTemplate&gt;   
       &lt;/asp:GridView&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is my current styling of the grid:</p>
  
  <pre><code> .grid 
      {background-color: #fff; 
      border: solid 2px #000; 
      border-collapse:collapse; 
      color: #FFF; overflow:auto
      }
  
      .grid td {
          padding-left: 5px;    
          color: #000; 
          font-size: medium;
      }
  
      .grid th  {    
            color: #000;
            background: #99C3BB; 
            font-size: medium;
            font-weight: bold;
      }
  
      .grid caption {
              color: #000;
              text-align:center;
              font-weight:bold;
              font-size:1.2em;
              padding: 2px;
              background-color: #99C3BB; 
              border: 2px solid black; 
          }
  
      .grid table tr td { 
            color: #000;   
            font-size: small;
            padding: 5px;
      }
  
      #DeviceGridWrapper
      {
         height: 250px;  
         width: 100%;
         padding-bottom: 10px; 
      }
  </code></pre>
  
  <p>The column that is the problem is the 'Address' column.  When only the textbox shows the width is set to '90%' programmatically.  When the textbox and label are shown, the textbox is set to '50%' and the label is '40%'.  They are side-by-side which is what I want.  I need the Address column to widen to accomodate both of the controls so that the label does not extend into the next column.</p>
  
  <p>Is there a way to set the Address column to a width that accomodates both controls?</p>
  
  <p>Thanks.</p>