Timeline overflow screw up next elements
<p>I am using <a href="http://visjs.org/timeline_examples.html" rel="nofollow noreferrer">a library that create timeline</a>. This is javascript based.</p>

<p>I have the following html </p>

<pre><code>&lt;div class="container"&gt;
  &lt;div class="row"&gt;
    //Stuff here
  &lt;/div&gt;
  &lt;div class="row&gt;
    &lt;div id="timeline"&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row&gt;
    //Other stuff here
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>And the timeline library is replacing my <code>$('#timeline')</code> element by the timeline</p>

<p>If I do not have many elements on my timeline, everything is fine
<a href="https://i.stack.imgur.com/aQJ9m.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/aQJ9m.png" alt="enter image description here"></a></p>

<p>But if I have more elements, the timeline is expending through the third <code>&lt;div class="row"&gt;</code>.
<a href="https://i.stack.imgur.com/7Lebi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/7Lebi.png" alt="enter image description here"></a></p>

<p>How to fix it to have the third row always placed after the timeline ?
I do not want to hide the overflow.
What CSS trick should I try ?</p>