垂直对齐引导程序[重复]答案

【问题标题】：Vertical Align Bootstrap [duplicate]垂直对齐引导程序[重复]
【发布时间】：2017-02-02 02:04:46
【问题描述】：

我正在尝试垂直对齐内联表单，但是我无法这样做。下面是我使用 Bootstrap 的代码。你能帮忙吗？

这不是一个重复的问题。在最后在这里发布我自己的问题之前，我已经在这里查看了其他 10 个问题。

<div class="row">
    <div class="col-md-12">
        <form>
            <div class="form-group">
                <label class="control-label">Label</label>
                <input type="text" class="form-control" />
                <button class="btn btn-default" type="button">Button</button>
            </div>
        </form>
    </div>
</div>

试过了。不工作。以下是更新的代码：-

<div class="row">
    <div class="col-md-12">
        <form class="form-inline">
            <input type="text" class="form-control" />
            <button class="btn btn-default" type="button">Button</button>
        </form>
    </div>
</div>

下面是截图.. 输入框是如何贴在上面的：

【问题讨论】：

正在工作，请查看 sn-p
我的代码有什么问题。真的不行。
发布完整的html代码
必须是其他推动它的元素。

标签： html css twitter-bootstrap vertical-alignment

【解决方案1】：

只需在表单标签中添加class="form-inline"

<!doctype html>
<html>
<head>
 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
          <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  </head>

    <body>
      
      <div class="container-fluid">
        <div class="row">
     <div class="col-md-12 col-sm-12 col-xs-12">
     
        <form  class="form-inline">
            <div class="form-group">
           
            
                <label class="control-label">Label</label>
              
              
                <input type="text" class="form-control" >
                
                <button class="btn btn-default" type="button">Button</button>
                </div>
                
            
        </form>
   
</div>
        </div>
        </div>
</body>
  </html>

【讨论】：

不工作。试过了。 Txt 框仍然停留在顶部，而不是像按钮居中对齐那样居中。