overflow auto bei responsive design

[Michael_K]

Hallo,

ich bin auf der Suche nach einer Lösung für ein Problem, was eigentlich ganz einfach klingt. Ich habe zwei div container mit jeweils viel Inhalt.

1. Auf einem breiten Bildschirm sollen die beiden Container nebeneinander dargestellt werden und jeder container ist für sich unabhängig scrollbar, wenn die höhen des Bildschrims nicht ausreicht.

2. Auf einem kleinen Bildschirm sollen die beiden Container untereinander dargestellt werden. Dabei sollen die Inhalten im Container nicht mer scrollbar sein, sondern die beiden Container werden vollständig nacheinander angezeigt und der Inhalt des Oberelement, in dem sich beide Container befinden soll scrollbar sein.

Ich wollte es mit bootstrap-Framework realisieren, aber irgendwie erreiche ich nicht meine Lösung. Kann es sein, dass ich hier wirklich nur mit einer Lösung mit media-query in den global styles es schaffe und mit den bootstrap-Klassen es nicht?

Ich hatte an zwei Spalten gedacht, etwa so:

<div class="row">
  <div class="col-12 col-lg-6">
   Viel Text hier
 </div>
 <div class="col-12 col-lg-6">
   Noch einmal viel text
 </div>
</div>