Как убрать пробел между ul и li ⇐ Html

[Anonymous]

Мой код HTML и CSS

Код: Выделить всё

[list]
[*][url=#]Tab one[/url]
[*][url=#]Largeeeeeeeeeeeeeeeeeeeeeeee  Tab[/url]
[*][url=#]Tab three[/url]
[/list]

CONTENT

ul.tabs {
margin: 0px;
padding: 0px;
}

ul.tabs li {
list-style: none;
display: inline;
}

ul.tabs li a {
display:inline-block;
width:10%;
margin-bottom:0px;
color: #FFFFFF;
padding: 8px 14px 8px 14px;
text-decoration: none;
font-size: 9px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
text-transform: uppercase;
border: 1px solid #ffcce5;
background: #ffcce5;
border-radius:6px 6px 0 0;
text-overflow: ellipsis;
white-space: nowrap;
overflow:hidden;
}
.content {
background-color: #ffffff;
padding: 10px;
border: 1px solid #464c54;
}

Я пытаюсь отобразить представление вкладки, все работает нормально, пока я не добавлю

Код: Выделить всё

text-overflow: ellipsis;
white-space: nowrap;
overflow:hidden;

Здесь показан разрыв между ul и li, я не смог удалить пробел (горизонтальный) без удаления

Код: Выделить всё

overflow:hidden;

Я не знаю, где я ошибся.
jsfiddle

Подробнее здесь: https://stackoverflow.com/questions/203 ... -ul-and-li