我正在尝试使用 Bootstrap 3.1.1 格式化我的注册页面。我希望前两个输入在同一行上，而其他输入是自己的行。我试过 Bootstrap 类“行”、“内联表单”和“水平表单”，但都无济于事。

有人知道怎么做吗？

这是 Fiddle

<style>
.reg_name {
 max-width:200px;
}
</style>


<form name="registration_form" id='registration_form' class="form-inline">

        <div class="form-group">
            <label for="firstname" class="sr-only"></label>
            <input id="firstname" class="form-control input-group-lg reg_name" type="text" name="firstname"
                   title="Enter first name"
                   placeholder="First name"/>
        </div>

        <div class="form-group">
            <label for="lastname" class="sr-only"></label>
            <input id="lastname" class="form-control input-group-lg reg_name" type="text" name="lastname"
                   title="Enter last name"
                   placeholder="Last name"/>
        </div>

    <div class="form-group">
        <label for="username" class="sr-only"></label>
        <input id="username" class="form-control input-group-lg" type="text" autocapitalize='off' name="username"
               title="Enter username"
               placeholder="Username"/>
    </div>

    <div class="form-group">
        <label for="password" class="sr-only"></label>
        <input id="password" class="form-control input-group-lg" type="password" name="password"
               title="Enter password"
               placeholder="Password"/>
    </div>

 </form>

最佳答案

使用 <div class="row">和 <div class="form-group col-xs-6">

这里有一个 fiddle :https://jsfiddle.net/core972/SMkZV/2/

关于html - Bootstrap 3 : How to get two form inputs on one line and other inputs on individual lines?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22888298/