小编ren*_*nca的帖子

无法将按钮与水平形式对齐(非内联)(Bootstrap)

在下面的代码中,我有 2 个按钮和 3 个带标签的输入。我希望按钮与输入对齐,但它们与标签对齐。我尝试过内联表单,但将标签放在侧面是行不通的。

在不过度破坏引导程序的情况下完成此任务的最佳选择是什么?

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
</script>

<form role="form">
  <div class="row">
    <div class="form-group col-xs-1">
      <button type="button" class="btn btn-success btn-add">+</button>
    </div>
    <div class="form-group col-xs-3">
      <label>Text Input</label>
      <input class="form-control">
      <p class="help-block">Example block-level help text here.</p>
    </div>
    <div class="form-group col-xs-3">
      <label>Text Input</label>
      <input class="form-control">
      <p class="help-block">Example block-level help text here.</p>
    </div>
    <div class="form-group col-xs-3">
      <label>Text Input</label>
      <input class="form-control">
      <p class="help-block">Example block-level help text here.</p>
    </div>
    <div class="form-group col-xs-2">
      <button type="submit" class="btn btn-default">Filter</button>
    </div>
</form>
Run Code Online (Sandbox Code Playgroud)

html css twitter-bootstrap

4
推荐指数
1
解决办法
5464
查看次数

标签 统计

css ×1

html ×1

twitter-bootstrap ×1