Вёрстка Middle Вёрстка на практике обновлено
Обрезка на трёх строках
Условие
Текст в .excerpt должен показываться максимум в три строки, дальше - многоточие. Ширина 220px.
Что проверяют тесты
ограничение в три строки
режим блока с ориентацией
лишнее скрыто
высота соответствует трём строкам
Как подойти
Набор из четырёх свойств с вендорным префиксом, который де-факто стандарт (любопытная деталь: getComputedStyle в свежих версиях Chrome возвращает для него flow-root, а не исходное значение) и поддерживается везде, несмотря на префикс. Стандартное свойство line-clamp появилось недавно и пока пишут оба. Тонкость: многоточие рисуется автоматически, отдельного text-overflow здесь не нужно.
Подсказки: 2
- Одного свойства мало - нужен режим -webkit-box и вертикальная ориентация.
- Без overflow: hidden обрезка не наступит.
Решите в тренажёре
Редактор с автотестами прямо в браузере. Можно решить спокойно, вслух или под таймером, как на собесе.