Ramka display:table z rodzicem z paskiem przewijania z div overflow:auto

Weźmy sobie kod:

<div style="width:100%;overflow:auto;">
  <div style="display:table;width:100%">
     jakaś tam zawartość dowolna
  </div>
</div>

Co robi powyższy kod? div z display:table dopasowuje się do swoich dzieci, a div z overflow:auto rozszerza się na całą szerokość ekranu, i w razie potrzeby pojawia się pasek przewijania dolny, gdy by div z display:table miało szerokość większą niż szerokość ekranu oprzeglądarki. Ale w tym jeden pewny problem, w przypadku dzieci w div z display:table, tam w środku nie chce się pojawiać się pasek przewijania, tylko div z display:table rozszerza się dalej w poziomie do swoich dzieci. przecież tam w środku , tam gdzie jest jakaś tam zawartość dowolna mógł być tam pasek przewijania z div z overflow:auto i rodzic div z display:table mogło być mniejsze w przypadku szerokości, i też było by dobrze. Pytanie: Jak to zrobić by tak było?

Któryś już Twój post na ten sam temat. Nie masz w zwyczaju odpowiadać, więc moja odpowiedź znowu będzie jak do ściany. Przeczytałem twój tekst kilka razy i ciężko cokolwiek zrozumieć, chyba wagarowałeś na języku polskim.
Nie pokazałeś nam dzieci, a to chyba w nich jest problem. Zgaduję, że w miejscu jakaś tam zawartość dowolna masz jakieś elementy HTML. Pewnie diva, ale oczywiście nam go nie pokazałeś.

Chcesz, żeby linijki tekstu nie były łamane jak tutaj?
https://codepen.io/zerakot/pen/WNzJaRW

Czy chodzi, ci o to, że twój rodzic ma szerokość np. 100px, a div z display:table ma 150px, pomimo zastosowania overflow: auto;?

Odpowiedziałeś nie na temat i wcale ten mój post nie pokrywa się z innymi moimi tematami na tym serwisie!