오버플로 : 숨김은 텍스트를 아래로 밀어냅니다.

overflow: hidden첫 번째 스팬 ( .welcome-show) 의 클래스에 추가하면 어떤 이유로 다른 스팬 을 약간 아래로 밀어냅니다. 이 문제를 어떻게 해결할 수 있습니까? PHTML :

 <div class="col-lg-6 pull-left">
     <p>
         <span class="welcome-show">Здравей, <?php echo $this->EscapeHtml($user->nick) ?></span>
         <span class="rank">Ранк:
             <?php
                 switch ($user->role) {
                     case 1:
             ?>
             <span class="rank-vip">VIP</span>
             <?php
                     break;
                     case 2:
             ?>
             <span class="rank-vipplus">VIP+</span>
             <?php
                     break;
                     default:
             ?>
             <span class="rank-none">Никакъв</span>
             <?php
                     break;
                 }
             ?>
         </span>
         <span class="credits-show">Кредити: 
             <?php echo $this->EscapeHtml($user->credits) ?>
         </span>
         <a href="/charge-credits" class="credits-charge-link">
             <img src="/img/ui-icon-credits" class="ui-icon-credits"/>Заредете кредити
         </a>
         <a href="/edit" class="register">
             <span class="icon icon-settings ui-icon ui-icon-gear"></span>Настройки
         </a>
         <a href="/logout" class="register">
             <span class="icon icon-logout ui-icon ui-icon-close"></span>Излез
         </a>
     </p>
 </div>
 <?php
      } else {
  ?>
  <div class="col-lg-6 pull-left">
      <p>
          <a href="/login" class="login">
              <span class="icon icon-login ui-icon ui-icon-key"></span>Влез
          </a>
          <a href="/register" class="register">
              <span class="icon icon-register ui-icon ui-icon-person"></span>Регистрирай се
          </a>
      </p>
  </div>
  <?php
      }
  ?>

CSS :

.welcome-show {
    display: inline-block;
    max-width: 200px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}