CODEWITHSUNDEEP
c#cssasp.nettwitter-bootstrap
Alvin
Alvin

Reputation: 408

Textbox width not adjusting in bootstrap

I am currently trying to change the width of the textbox using grid columns. However, I tried to change the size of the column by decreasing or increasing but it doesn't change. May I know why?

I am currently doing it in C# and here's my sample code that I've tried

aspx file

<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>

Upvotes: 0

Views: 1266

Answers (3)

Alvin
Alvin

Reputation: 408

My error was in my MasterPage. I used form-inline instead of form-horizontal. Changing it solved the problem. Thanks @Zack

Upvotes: 0

Amey Kamat
Amey Kamat

Reputation: 181

Try this

<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>

Upvotes: 0

Mivaweb
Mivaweb

Reputation: 5722

Try setting only the col class on the parent div element of the input, the input element wil then take 100% full width of this parent element because of the form-control css class of 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>

Upvotes: 1

Related Questions