title: How to scroll two div simultaneously on Mozilla Firefox?
body: <p>I have two div in a bootstrap modal.</p>
  <pre><code>&lt;div class=&quot;col-md-6&quot;&gt;
     &lt;div class=&quot;textarea_before forScroll&quot; &gt;        
     &lt;/div&gt; 
  &lt;/div&gt;
  &lt;div class=&quot;col-md-6&quot;&gt;
     &lt;div class=&quot;textarea_after forScroll&quot; &gt;        
     &lt;/div&gt; 
  &lt;/div&gt;
  </code></pre>
  <p>I gave style like this</p>
  <pre><code>.textarea_before,.textarea_after{
          height: calc(100vh - 300px);
          border: 1px solid black;
          padding:5px;
          background-color: #f2f2f2;
          overflow: scroll;
          scroll-behavior: smooth;
          display: flex;
      }
  </code></pre>
  <p>And I have written jQuery code like this</p>
  <pre><code>var subCatContainer = $(&quot;.forScroll&quot;);
  subCatContainer.scroll(function() {
     subCatContainer.scrollTop ($(this).scrollTop ());
  });
  </code></pre>
  <p>It is working fine in Chrome. But it's not working on Mozilla Firefox. Can anyone help me to find where is the problem?</p>