Задать вопрос
@nickname13384

Как обрезать текст в адаптивном блоке?

Как обрезать текст?
Текст должен максимум занимать 2 строки, в конце ставить ...
Самое важное! если длинна слова в первой строке больше чем может занимать блок, то обрезать сразу в первой строке!

Нельзя высчитывать по количеству символов в строке, т.к. блок респонсив

<style>  
.normal{
    line-height: normal;
    font-size: 10px;
    width: 30%;
    margin-left:10vw;
  }
  </style>
<div class="container">
<article class="normal">
      Lorem ipsum dolor sit amet consect eturad ipiscingelit Vivamus laoreetu llamcorpe rpharetra. Fusce facilisis odio eu leo laoreet aliquet vitae vitae nibh.
      Duis quis quam vestibulum, faucibus eros sed, gravida odio. Mauris sed tincidunt eros. Nunc varius quis enim quis dictum.
      Vivamus sed arcu mi. Nam semper cursus augue nec pulvinar.
    </article>

<article class="normal">
      LoremipsumdolorsitametconsecteturadipiscingelitVivamuslaoreetullamcorperpharetra.Fusce facilisis odio eu leo laoreet aliquet vitae vitae nibh.
      Duis quis quam vestibulum, faucibus eros sed, gravida odio. Mauris sed tincidunt eros. Nunc varius quis enim quis dictum.
      Vivamus sed arcu mi. Nam semper cursus augue nec pulvinar.
    </article>
</div>
  • Вопрос задан
  • 207 просмотров
Подписаться 1 Средний Комментировать
Пригласить эксперта
Ответы на вопрос 2
Seasle
@Seasle Куратор тега JavaScript
Идеального способа нет. Юзайте это, и необходимо будет сделать fallback через max-height и overflow (можно еще 3 точки через псевдоэлемент поставить будет).
Ответ написан
Комментировать
@AleksRap
Используйте dotdotdot плагин. Он умеет в адаптивность
Ответ написан
Ваш ответ на вопрос

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

Похожие вопросы