locked
Css Issue RRS feed

  • Question

  • User-797751191 posted

    Hi

       I have below code and i want Address to be in next row

    <div class="form-group col-md-4 has-error">
                                                    <label>Name</label>
                                                    <asp:TextBox ID="txtName" runat="server" class="form-control"></asp:TextBox>
                                                </div>
                                                <div class="form-group col-md-4 has-error">
                                                    <label>Designation</label>
                                                    <asp:TextBox ID="txtAddress" runat="server" class="form-control"></asp:TextBox>
                                                </div>
    
                                                <div class="form-group col-md-4 has-error">
                                                    <label>Address</label>
                                                    <asp:TextBox ID="txtAddress" runat="server" class="form-control" ></asp:TextBox>
                                                </div>

    Thanks

    Monday, June 24, 2019 6:12 AM

All replies

  • User-1038772411 posted

    Hi, jsshivalik

    Without your output Snap no one can completely help you to solve your problem means its hard to assume, as of now as per your question and see code structure just You can use HTML "<br>" Break line tag above address DIV.

    Or,

    you can use bootstrap using container row and col-12 class for above two div. after below that user new "Row" and "col-12" for address so u can see address DIV below TextName and TextDesignation textboxes.

    Thanks.

    Monday, June 24, 2019 7:01 AM
  • User288213138 posted

    Hi jsshivalik,

    You can put the address into another <div class="row">.

    Here is a demo you can use as a reference.

    The code:

    <div class="row">
                <div class="form-group col-md-4 has-error">
                    <label>Name</label>
                    <asp:TextBox ID="txtName" runat="server" class="form-control"></asp:TextBox>
                </div>
                <div class="form-group col-md-4 has-error">
                    <label>Designation</label>
                    <asp:TextBox ID="txtAddress" runat="server" class="form-control"></asp:TextBox>
                </div>
            </div>
            <div class="row">
                <div class="form-group col-md-4 has-error">
                    <label>Address</label>
                    <asp:TextBox ID="TextBox1" runat="server" class="form-control"></asp:TextBox>
                </div>
            </div>
    

    The result:

    Best regards,

    Sam

    Monday, June 24, 2019 8:10 AM
  • User-474980206 posted

    the bootstrap grid row has 12 columns. your form-group are all 4 columns. you could make address over 3 cols to force new line. you could add row markup around the first two, lots of options. you should learn the bootstrap grid.

    Monday, June 24, 2019 3:31 PM