title: vertical-align after pull-right in bootstrap
body: <p>I want the element which is pulled right to be vertical-aligned, but I didn't succeed, I've been searching online for a while, some say that I should also specify a <code>line-height</code> value, but it didnt' work for me.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.float-vertical-align {
    vertical-align: middle;
    line-height: 20px;
    border: 1px solid red;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /&gt;
  &lt;nav class="navbar navbar-default navbar-static-top"&gt;
    &lt;div class="container-fluid"&gt;
      &lt;div class="navbar-header"&gt;&lt;a href="#" class="navbar-brand"&gt;Sample&lt;/a&gt;
      &lt;/div&gt;
      &lt;div class='pull-right float-vertical-align'&gt;
        &lt;span&gt;Some text here&lt;/span&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/nav&gt;</code></pre>
  </div>
  </div>
  </p>