php - overflow: hidden pushes text down -


when add overflow: hidden class of first span (.welcome-show), reason pushes other ones down bit. how can fix ? screenshot 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; } 

this align other element goes down center vertical. change height in answer. hope helps :)

.the-other-element{  height:100px;  line-height:100px;  ... } 

Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -