Есть ли какая-нибудь маска JS/CSS/jQuery, я могу работать, чтобы определить, отрезан ли последний видимый бит содержимого в div, и немного увеличить/уменьшить размер DIV высота, чтобы предотвратить обрезание текста?Установите высоту DIV, чтобы текст не был разрезан или разрезан горизонтально
Наша система позволяет пользователю вводить «элементы», содержащие XHTML (с помощью элемента управления Telerik Edit). У нас есть страница ElementList, где мы показываем все введенные пользователем элементы. Однако, поскольку введенный пользователем XHTML может быть очень большим, на странице списка мы хотим показать только первые 3 строки каждого. Поэтому я установил DIV, содержащий XHTML, на определенную высоту, равную 3 строкам текста, и установите overflow: hidden. Все идет нормально.
Однако, поскольку пользователь может ввести XHTML, они могут создавать таблицы с дополнением (или иначе расходятся со стандартной высотой текста). Текст внутри этих ячеек, по-видимому, разрезан горизонтально, из-за сочетания высоты и переполнения: скрытый. Нашим требованиям человек не нравится внешний вид этого; но, конечно, мы не можем ограничить XHTML, редактируемый конечным пользователем.
Here is a JSFiddle example вопроса.
Этот вопрос не является дубликатом:
- «Stopping cut off text in variable height div...», как этот вопрос включает в себя «WebKit-линейный зажим», который не имеет никакого отношения к моей ситуации. (и в любом случае этот вопрос никогда не отвечал)
- «Cut text by height, no truncate», поскольку этот вопрос касается DIV, содержащего чистый текст; мой DIV содержит XHTML. Вы заметите в JSFiddle, что я уже определяю размер DIV, используя измерение em.
Этот вопрос полностью меня озадачил - я надеюсь, что сообщество SO может прийти мне на помощь!
UPDATE:
В конце концов, я подозреваю, что это не может быть решена с помощью HTML/JS/JQuery. Фактически, вы можете создавать таблицу (или серию DIV) с постепенно увеличивающимся верхним краем, так что нет возможности избежать нарезки хотя бы одного из них.
Спасибо всем за их ответы. Я отмечаю это как ответ, потому что, на мой взгляд, это особенно простой/элегантный обходной путь.
Вы действительно должны использовать 'высота: 3.5em;' на контейнере? Что делать, если вы удалите это, и пусть высота div определяется браузером? – bfavaretto
@bfavaretto - к сожалению нет. Как отмечено в этом вопросе, полное содержание DIV, вероятно, будет намного больше, чем мы хотим видеть при просмотре элемента в списке. Другими словами, мы должны ограничить высоту DIV. – mikemanne
Итак, вы хотите изменить высоту, если текст «немного» больше, чем позволяет блок, верно? –