Ширина текстового поля не настраивается в bootstrap

Question

В настоящее время я пытаюсь изменить ширину текстового поля, используя столбцы сетки. Однако я попытался изменить размер столбца, уменьшив или увеличив, но он не изменился. Могу я узнать почему?

В настоящее время я делаю это в C# и вот мой пример кода, который я пытался

ASPX файл

<div class="row"> 
    <div class="form-group col-lg-11"> 
     <asp:label id="Label1" runat="server" cssclass="col-lg-2 control-label input-lg" text="User ID: "></asp:label> 
     <div class="col-lg-10"> 
      <asp:textbox id="TextBox1" maxlength="20" cssclass="form-control input-lg" runat="server"></asp:textbox> 
     </div> 
    </div> 
</div> 

Answer 1

Моя ошибка была в моей MasterPage. Я использовал form-inline вместо form-horizontal. Его изменение решило проблему. Спасибо @Zack

Answer 2

Попробуйте установить только класс Col на родительском сНу элемента входа, входной элемент wil затем принимает 100% полную ширину этого родительского элемента из-за класса form-control css Bootstrap.

<div class="form-group"> 
    <div class="col-lg-11"> 

     <asp:Label ID="lblUserID" runat="server" CssClass="control-label input-lg" Text="User ID: "></asp:Label> 
     <asp:TextBox ID="tbUserID" MaxLength="20" CssClass="form-control input-lg" runat="server"></asp:TextBox> 

    </div> 
</div> 

Answer 3

Попробуйте

<div class="form-group col-lg-11"> 
    <asp:Label ID="lblUserID" runat="server" CssClass="col-lg-2 control-label input-lg" Text="User ID: "></asp:Label> 
    <div class="col-lg-9"> 
      <asp:TextBox ID="tbUserID" MaxLength="20" CssClass="form-control input-lg" runat="server"></asp:TextBox> 
    </div> 
</div>