выравнивания по вертикали текст в навигационной панели

Question

Как я вертикального выравнивания текста внутри navbar или колонтитула

Я попробовал несколько вещей, упомянутых здесь, но я не был в состоянии сделать это. http://phrogz.net/CSS/vertical-align/index.html

Можете ли вы по крайней мере указать мне на источник, где я могу узнать о том, о выравнивании

Это, как он выглядит:

Источник:

<div class='navbar navbar-fixed-bottom navbar-inverse'> 
    <div class='navbar-inner'> 
     <div class='container-fluid'> 
     <ul class='nav pull-left'> 
      <li style='font-size:medium; color: #E8E8E8'> 
      <ul class='inline'> 
       <li class='active'> 
       <i class='icon-warning-sign'></i> 
       TEXT HERE 
       </li> 
      </ul> 
      </li> 
     </ul> 
     </div> 
    </div> 
    </div> 

Answer 1

Это Работало!

что-то магическое в %a

-# without %a it doesn't go in the middle vertically 
.navbar.navbar-fixed-bottom.navbar-inverse{style: 'position:fixed'} 
    .navbar-inner 
    %ul.nav.pull-left 
     %li.active 
     %a 
      %span 
      %i.icon-warning-sign 
      TEXT HERE 

Answer 2

Если это всего лишь одна строка текста, установите line-height вашего, содержащего., совпадающее это height, например:

CSS

.navbar { 
    line-height: 100px; 
    height: 100px; 
} 

HTML

<div class='navbar'> 
    <p>TEXT HERE</p> 
</div> 

Codepen sketch.

Answer 3

Я не уверен, что лучшее решение, но вы можете играть с margin-top до вертикально выравнивать материал. В вашем примере, просто играя с ним в браузере, это заставило меня вертикально:

 ul.nav li ul li{ margin-top: 10px; } 

Вы можете настроить его более по своему вкусу, играя со значениями или селекторов. Надеюсь, поможет.