@Anettc

Почему не работает свойство text-overflow: ellipsis; в Mozilla?

Как сделать так, чтобы получить аналог text-overflow: ellipsis; для мультистроки? это свойство, которое добавляет троеточие к строке, если текст в контейнер не влезает.. Нет окончательного решения. есть вариант с -webkit-box и —webkit-line-clamp, но он не работает в Мозилле)
  • Вопрос задан
  • 6140 просмотров
Пригласить эксперта
Ответы на вопрос 2
groog
@groog
Я только учусь
text-overflow работает в связке со следующими свойствами для inline тегов (span и пр.)

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

Пример: https://jsfiddle.net/groog/vo3x7c6w/

Для многострочного этот вариант не подходит, но есть решения на JS
Для ванилы:
https://github.com/glinford/ellipsis.js
https://github.com/josephschmitt/Clamp.js
Для JQ:
https://github.com/jjenzz/jquery.ellipsis
Ответ написан
micro-CMS
@micro-CMS
автор книги по продажам, создатель собственной CMS
.line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;  
  overflow: hidden;}

нашел в перевод буржа - проверил, но не в мозиле - работает
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
18 апр. 2024, в 21:56
2000 руб./за проект
18 апр. 2024, в 21:00
150 руб./за проект