Display multiple TextBox in a single row using Bootstrap class in ASP.Net

Last Reply 7 months ago By YacharuP

Posted 7 months ago

As I have tried this code butb couldn't place the text box in same row and i have six fields...I am new in designing bootstrap 

<div class="col-sm-12">
    <div class="form-group">
        <div class="col-sm-2">
            <div class="col-lg-6 col-md-2 control-label">
                <asp:Label ID="Label7" runat="server" Text="Shade"></asp:Label>
            </div>
            <div class="col-lg-9 col-md-2">
                <asp:TextBox ID="txtval6" runat="server" Width="50px"></asp:TextBox>
            </div>
        </div>
        <div class="col-sm-2">
            <div class="col-lg-6 col-md-2 control-label">
                <asp:Label ID="Label8" runat="server" Text="Item"></asp:Label>
            </div>
            <div class="col-lg-9 col-md-2">
                <asp:TextBox ID="txtval7" runat="server" Width="150px"></asp:TextBox>
            </div>
        </div>
        <div class="col-sm-2">
            <div class="col-lg-6 col-md-6 control-label">
                <asp:Label ID="Label9" runat="server" Text="Lot"></asp:Label>
            </div>
            <div class="col-lg-9 col-md-8">
                <asp:TextBox ID="txtval8" runat="server" Width="50px"></asp:TextBox>
            </div>
        </div>
        <div class="col-sm-2">
            <div class="col-lg-6 col-md-6 control-label">
                <asp:Label ID="Label10" runat="server" Text="Cones"></asp:Label>
            </div>
            <div class="col-lg-9 col-md-8">
                <asp:TextBox ID="txtval9" runat="server" Width="100px"></asp:TextBox>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="col-lg-6 col-md-8 control-label">
                <asp:Label ID="Label11" runat="server" Text="Gross Weight"></asp:Label>
            </div>
            <div class="col-lg-9 col-md-8">
                <asp:TextBox ID="txtval10" runat="server" Width="50px"></asp:TextBox>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="col-lg-6 col-md-6 control-label">
                <asp:Label ID="Label12" runat="server" Text="Net Weight"></asp:Label>
            </div>
            <div class="col-lg-9 col-md-8">
                <asp:TextBox ID="txtval11" runat="server" Width="50px"></asp:TextBox>
            </div>
        </div>
    </div>
</div>
You are viewing reply posted by: YacharuP 7 months ago.
Posted 7 months ago Modified on 7 months ago

Hi @sujayanand,

 Try with this code.

<div class="row">
    <div class="col-md-2">
        <div class="col-lg-9 col-md-3 control-label">
            <asp:Label ID="Label7" runat="server" Text="Shade"></asp:Label>
        </div>
        <div class="col-lg-9 col-md-8">
            <asp:TextBox ID="txtval6" runat="server" CssClass="form-control"></asp:TextBox>
        </div>
    </div>
    <div class="col-md-2">
        <div class="col-lg-9 col-md-3 control-label">
            <asp:Label ID="Label8" runat="server" Text="Item"></asp:Label>
        </div>
        <div class="col-lg-9 col-md-8">
            <asp:TextBox ID="txtval7" runat="server" CssClass="form-control"></asp:TextBox>
        </div>
    </div>
    <div class="col-md-2">
        <div class="col-lg-9 col-md-3 control-label">
            <asp:Label ID="Label9" runat="server" Text="Lot"></asp:Label>
        </div>
        <div class="col-lg-9 col-md-8">
            <asp:TextBox ID="txtval8" runat="server" CssClass="form-control"></asp:TextBox>
        </div>
    </div>
    <div class="col-md-2">
        <div class="col-lg-9 col-md-3 control-label">
            <asp:Label ID="Label10" runat="server" Text="Cones"></asp:Label>
        </div>
        <div class="col-lg-9 col-md-8">
            <asp:TextBox ID="txtval9" runat="server" CssClass="form-control"></asp:TextBox>
        </div>
    </div>
    <div class="col-md-2">
        <div class="col-lg-9 col-md-4 control-label">
            <asp:Label ID="Label11" runat="server" Text="Gross Weight"></asp:Label>
        </div>
        <div class="col-lg-9 col-md-8">
            <asp:TextBox ID="txtval10" runat="server" CssClass="form-control"></asp:TextBox>
        </div>
    </div>
    <div class="col-md-2">
        <div class="col-lg-9 col-md-4 control-label">
            <asp:Label ID="Label12" runat="server" Text="Net Weight"></asp:Label>
        </div>
        <div class="col-lg-9 col-md-8">
            <asp:TextBox ID="txtval11" runat="server" CssClass="form-control"></asp:TextBox>
        </div>
    </div>
</div>

 

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html