2013-07-02 2 views
4

Здравствуйте, я пытаюсь реализовать navlist, который можно найти на http://twitter.github.io/bootstrap/components.html#navs Я посмотрел на исходный код, и я попытался использовать свой код и мой собственный:Размещение шеврон справа - Navlist

 <div class="span3 bs-docs-sidebar"> 
     <ul class="nav nav-tabs nav-stacked bs-docs-sidenav span8"> 
      <li><a href="#Variabler"><b>Variabler</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#Datatyper"><b>Datatyper</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#Funktioner"><b>Metoder</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#"><b>Arrays</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#"><b>Klasser</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#variables"><b>HTML5</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#variables"><b>CSS3</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#variables"><b>jQuery</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#variables"><b>AJAX</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#variables"><b>PHP</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#variables"><b>MySQL</b><i class="icon-chevron-right"></i></a></li> 
      <li><a href="#variables"><b>Twitter Bootstrap</b><i class="icon-chevron-right"></i></a></li> 
     </ul> 
    </div> 

в результате я получаю это:

enter image description here

Как я могу поместить шевроны вправо? Пытался платить со смещением, но шевроны были бы расположены по-разному в зависимости от того, сколько длинных строк.

ответ

4

Вы можете добавить класс 'вырывание права' значки:

<ul class="nav nav-tabs nav-stacked bs-docs-sidenav span8"> 
    <li><a href="#Variabler"><b>Variabler</b><i class="icon-chevron-right pull-right"></i></a></li> 
    <li><a href="#Datatyper"><b>Datatyper</b><i class="icon-chevron-right pull-right"></i></a></li> 
    <li><a href="#Funktioner"><b>Metoder</b><i class="icon-chevron-right pull-right"></i></a></li> 
    ... 
</ul> 

Demo: http://www.bootply.com/66221

+0

Благодаря она работала. – user1924247

Смежные вопросы