我试图使用bootstrap将标签文本框和另一个标签和文本框放在一行中,但它不会出现在同一行

时间:2016-09-06 10:17:04

标签: asp.net twitter-bootstrap

 <div class="row">
                              <form class="form-inline">
                                <div class="form-group">
                                    <asp:Label runat="server" AssociatedControlID="tb_FName" CssClass="col-md-2 control-label">First Name</asp:Label>
                                    <div class="col-md-10" >
                                        <asp:TextBox runat="server" ID="tb_FName" CssClass="form-control"  />
                                        <asp:RequiredFieldValidator runat="server" ControlToValidate="tb_FName"
                                            CssClass="text-danger" ErrorMessage="The First Name field is required." SetFocusOnError="True" Display="Dynamic" />
                                    </div>
                         </div>

                            <div class="form-group" style="float:right">
                                    <asp:Label runat="server" AssociatedControlID="tb_LName" CssClass="col-md-2 control-label">Last Name</asp:Label>
                                    <div class="col-md-10 ">
                                        <asp:TextBox runat="server" ID="tb_LName" CssClass="form-control"  />
                                        <asp:RequiredFieldValidator runat="server" ControlToValidate="tb_LName"
                                            CssClass="text-danger" ErrorMessage="The Last Name field is required." SetFocusOnError="True" Display="Dynamic" />
                                   </div>
                                     </div>
                                  </form>
                                    </div>

有一个标签和一个文本框以及另一个标签和文本框。第二行中有第二个标签和文本框。我需要进入同一行。我已将它放在一行并使用了form-inline也..我尝试更改列空间仍然不起作用。

2 个答案:

答案 0 :(得分:2)

你可以使用class =“col-md-3”来设置行中的所有3个项目。

答案 1 :(得分:0)

在其他人做之前添加我的评论作为答案....

col-md-10更改为col-md-6 Bootstrap将网格划分为12列。您可以查看Bootstrap以获取有关网格的更多信息