Почему обрезка строки не работает в chrome?

Question

[vasIvas]

Почему этот код не работает и как сделать его рабочим в chrome? ссылка на codepen

<div class="container">
  <ul class="list">
    <li class="item"><a href="#" class="text">some text</a></li>
    <li class="item"><a href="#" class="text">some text</a></li>
    <li class="item"><a href="#" class="text">some text</a></li>
  </ul>
</div>

.container {
  width: 100px;
}

.list {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.item {
  display: inline-block;
}

.text {
  display: block;
}

в FireFox

в Chrome

Comments

[Дмитрий Кравченко]

хром, все работает

[vasIvas]

Дмитрий Кравченко: у меня ubuntu и в хроме не работает...

Answer 1

[Stalker_RED]

Потому что вы зачем-то сделали сcылки блоком.
codepen.io/anon/pen/ZQrbLL

Comments

[vasIvas]

Это для того чтобы обрезать по слову, а не по буквенно. А Ваш пример, это совершенно другой пример не имеющий ничего общего с моей темой.

[Андрей Федоров]

vasIvas: ellipsis не режет словами.

Answer 2

[Дмитрий Кузнецов]

В каком смысле обрезка?
Догадываюсь, что дело в том, что вы стараетесь обрезать не сам текст (т.е. li эллемент), а блок.

Comments

[vasIvas]

Вы не правильно догадываетсь. Я картинок добавил.

[Дмитрий Кузнецов]

vasIvas: Может это спицифика браузера?!

[vasIvas]

Дмитрий Кузнецов: может, вопрос только не в этом.