DataTables: Как объединить тексты и горизонтальную полосу прокрутки вместе

Question

Ожидаемое поведение

У меня есть веб-страница, которая содержит таблицу со многими столбцами.Для каждой ячейки таблицы это может быть короткий текст или очень длинный текст.Поэтому я хочу иметь горизонтальную полосу прокрутки для отображения всех типов текста, будь то длинный или короткий.

Среда

Угловой 5 (https://angular.io) и DataTables (https://datatables.net), который является плагином для библиотеки jQuery Javascript для разработки.

Первая попытка

Я использовал горизонтальную полосу прокрутки дляотображение количества столбцов. Как упоминается в официальной документации DataTables (https://datatables.net/examples/basic_init/scroll_x.html),, я инициализировал таблицу с параметром "scrollX": true;, но обнаружил, что в таблице нет горизонтальной полосы прокрутки. "scrollX": true; ">

Вторая попытка

После установки опции "scrollX": true; я добавил class="nowrap" к моей таблице, появилась горизонтальная полоса прокрутки, но длинный текст не смогбудет отображаться хорошо. class="nowrap"">

DEMO LINK Вы можете проверить это на этой веб-странице, она имеет две таблицы, вариант которых"scrollX": true;, верхний имеет class="nowrap", а нижний - нет.

Вопрос

1. Почему в таблице отсутствует горизонтальная полоса прокрутки после настройки "scrollX": true;?
2. Как ширина столбцов может автоматически изменяться в зависимости от длины текста после установки class="nowrap"?

Кроме того, приветствуются любые другие решения или идеи.

Answer 1

в datatable вы можете использовать отзывчивое свойство независимо от того, как долго ваши данные будут обрабатываться ответно, здесь вы можете увидеть больше

https://editor.datatables.net/examples/extensions/responsive.html

Answer 2

Вы можете попробовать добавить display: inline-block; CSS к вашей таблице.