提交按钮的 div 包装器

Question

我有一个简单的登录表单：

<form action="/users/login" class="form-inline" id="UserLoginForm" method="post" accept-charset="utf-8">
    <div style="display:none;">
        <input type="hidden" name="_method" value="POST"/>
    </div>
    <input name="data[User][email]" class="input-small" placeholder="E-mail" maxlength="50" type="text" id="UserEmail"/>
    <input name="data[User][password]" class="input-small" placeholder="Password" type="password" id="UserPassword"/>
    <button class='btn' type='submit'>Login</button>
</form>

它使用引导程序进行样式设置。至于js jquery和AngularJS是加载的。

我的问题是，当我显示此表单时，我的提交按钮转到下一行。如果我检查 dom，我会在提交按钮周围看到一个 <div class="actions">...</div> 包装器。如果我从表单定义中省略 type='submit' 部分，则不会发生这种情况。

我的问题是谁在添加这个包装器，我该如何避免它。

Answer 1

如果您看到 Twitter Bootstrap 的示例，我可以看到它们使用两个类作为 form-inline 示例。 Please check this. 来自不同类型和表单的按钮。尝试同时应用well 类。

<form class="well form-inline">
  <input type="text" class="input-small" placeholder="Email">
  <input type="password" class="input-small" placeholder="Password">
  <label class="checkbox">
    <input type="checkbox"> Remember me
  </label>
  <button type="submit" class="btn">Sign in</button>
</form>