title: overflow: hidden pushes text down
body: <p>When I add <code>overflow: hidden</code> to the class of the first span (<code>.welcome-show</code>), for some reason it pushes the other ones down a bit. How can I fix this ?
  <img src="https://i.stack.imgur.com/eV92W.png" alt="screenshot">
  PHTML:</p>
  
  <pre><code> &lt;div class="col-lg-6 pull-left"&gt;
       &lt;p&gt;
           &lt;span class="welcome-show"&gt;Здравей, &lt;?php echo $this-&gt;EscapeHtml($user-&gt;nick) ?&gt;&lt;/span&gt;
           &lt;span class="rank"&gt;Ранк:
               &lt;?php
                   switch ($user-&gt;role) {
                       case 1:
               ?&gt;
               &lt;span class="rank-vip"&gt;VIP&lt;/span&gt;
               &lt;?php
                       break;
                       case 2:
               ?&gt;
               &lt;span class="rank-vipplus"&gt;VIP+&lt;/span&gt;
               &lt;?php
                       break;
                       default:
               ?&gt;
               &lt;span class="rank-none"&gt;Никакъв&lt;/span&gt;
               &lt;?php
                       break;
                   }
               ?&gt;
           &lt;/span&gt;
           &lt;span class="credits-show"&gt;Кредити: 
               &lt;?php echo $this-&gt;EscapeHtml($user-&gt;credits) ?&gt;
           &lt;/span&gt;
           &lt;a href="/charge-credits" class="credits-charge-link"&gt;
               &lt;img src="/img/ui-icon-credits" class="ui-icon-credits"/&gt;Заредете кредити
           &lt;/a&gt;
           &lt;a href="/edit" class="register"&gt;
               &lt;span class="icon icon-settings ui-icon ui-icon-gear"&gt;&lt;/span&gt;Настройки
           &lt;/a&gt;
           &lt;a href="/logout" class="register"&gt;
               &lt;span class="icon icon-logout ui-icon ui-icon-close"&gt;&lt;/span&gt;Излез
           &lt;/a&gt;
       &lt;/p&gt;
   &lt;/div&gt;
   &lt;?php
        } else {
    ?&gt;
    &lt;div class="col-lg-6 pull-left"&gt;
        &lt;p&gt;
            &lt;a href="/login" class="login"&gt;
                &lt;span class="icon icon-login ui-icon ui-icon-key"&gt;&lt;/span&gt;Влез
            &lt;/a&gt;
            &lt;a href="/register" class="register"&gt;
                &lt;span class="icon icon-register ui-icon ui-icon-person"&gt;&lt;/span&gt;Регистрирай се
            &lt;/a&gt;
        &lt;/p&gt;
    &lt;/div&gt;
    &lt;?php
        }
    ?&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.welcome-show {
      display: inline-block;
      max-width: 200px !important;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
  }
  </code></pre>