Отображение / форматирование табличных данных (веб)

Question

В моем примере у меня есть таблица, где каждая строка является, например, пользователем. Столбцы могут включать их имя, адрес, адрес электронной почты и т. Д. Теперь мне нужно добавить столбец (гипотетический пример) имен их кошек. В то время как у большинства людей не будет кошек, а у некоторых будет 1-2 кошки, случайный человек с 20 кошками образует один очень длинный ряд в таблице. Это дает мне проблему в презентации и для фильтрации / поиска имен кошек. Есть ли хорошее решение для отображения данных такого типа?

Answer 1

Сделайте так, чтобы первые 50 (или любые другие) символы поля отображались как обычно, а затем поместите остальные в блок с его видимостью, скрытой через CSS. Включите ссылку / кнопку / значок, который позволит пользователям переключать видимость, чтобы они могли видеть все значение.

Answer 2

Несколько вариантов:

<Ол>

Установите максимальную ширину ячейки и разрешите перенос данных

Поместите содержимое внутри тега-обертки (такого как div) и установите для div фиксированную ширину / высоту и стиль переполнения: скрытый, чтобы особо длинное слово не вытесняло ширину ячейки.

Обрезать выводимый текст на стороне сервера

Для случаев № 2 и № 3 установите атрибут Title тега TD, чтобы он содержал полный неусеченный текст. Это будет представлять собой всплывающую подсказку при наведении на ячейку.

Я бы упомянул другие решения на основе CSS, но они сейчас очень редко поддерживаются, поэтому упоминать не стоит.

Answer 3

Возможно, вы захотите попробовать сделать что-то вроде того, что делает SO. А именно, как только кто-то достигает определенной точки в своем Rep, он ставит суффикс числа и оценивает его. Ex. 10 тысяч вместо 10 236.

Таким образом, цифры не выходят из-под контроля.