Переполнение-х: скрытый; не будет работать, но overflow-x: scroll; буду?

Question

У меня есть таблица, которая содержит различную информацию. Я пытаюсь сделать так, чтобы при переполнении контента была предусмотрена горизонтальная полоса прокрутки для просмотра контента.

overflow-x: прокрутка; это именно то, что я хочу, за исключением того, что я не хочу показывать полосу прокрутки, когда нет содержимого для переполнения. Итак, переполнение-х: скрыто; должно быть то, что мне нужно. Однако, когда я использую это, никакая полоса прокрутки не появляется, даже если содержание переполняется.

Я использовал overflow-x: hidden; раньше, так что я не совсем уверен, что не так.

Пример можно увидеть через codepen

Соответствующий css находится в .dataTables_wrapper {} в строке 19

/* -----------NEED HELP HERE-----------       Cant get overflow-x: hidden to work */
.dataTables_wrapper{
  overflow-x: hidden; /*This wont work, acts like overflow hidden*/
  overflow-x: scroll; /*This works and is the desired effect but i dont want the scrollbar to show if no overflow*/
  background: #1B1E24;
}

Answer 1

Настройка overflow:auto исправит вашу проблему, добавит скроллер, когда ширина превысит

.dataTables_wrapper{
  overflow:auto; /* set overflow auto */
  background: #1B1E24;
}