Удаление пробелов между элементами навигационной панели

Question

Мой навигатор основан на неуказанном списке.

Each <li> is displayed as inline-block. 

Однако я не могу избавиться от белого пространства между Ли

nav-item li{ 
    width: 123px; 
    height: 120px; 
    display: inline-block; 
    padding: 0; 
    margin: 0; 
} 

Я исследовал этот предмет на StackOverflow/Google, но не нашли решение еще.

Plnkr здесь:

http://plnkr.co/edit/7irazgvxqkpCeurnQ0Yv 

Answer 1

Изменение display: inline-block; в float: left;:

nav-item li{ 
     width: 123px; 
     height: 120px; 
     float: left; 
     padding: 0; 
     margin: 0; 
} 

Answer 2

Удалите пробельных и разрывы строк в вашем HTML между ЛИС.

<ul> 
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li><li>Aliquam tincidunt mauris eu risus.</li><li>Vestibulum auctor dapibus neque.</li> 
</ul> 

Answer 3

Добавить white-space: normal; в класс нав-позиционным

.nav-item li{ 
    width: 123px; 
    height: 120px; 
    display: inline-block; 
    padding: 0; 
    margin: 0; 
white-space: normal; 
}