html - 如何将按钮和一些文本排成一行，并使文本垂直对齐 : middle;?

Question

我可以做到一行(如果有更好的解决方案，请告诉我)，但我不能使文本在中间垂直对齐。

   #info{
     vertical-align: middle;

    }

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


<div class="container">
    <div class="row">
        <div class="col-md-3 col-md-offset-3">
<div id="save">
    <div class="pull-left">
      <button type="button" class="btn btn-default"> 
          save
        </button>
    </div>
    <div class="pull-right" id="info">info</div>
    <div class="clearfix"></div>
  </div>
          </div>
      </div>
</div>

Answer 1

您必须对齐按钮和#info 的问题是 bootstrap 正在为按钮设置样式，但您的 div#info 样式不相同。

请记住将相似的样式添加到 #info 以获得相似的位置。在这种情况下，您只需要:

#info {
    display:inline-block;
    padding: 6px 12px;
    line-height:1.42857143;
}

您可以看到它正在运行 here .