title: Set margin-top according to the height of the other element
body: <p>I have two navbar´s (one under the other). My goal is that both are fixed at the top, so I applied to both (fixed-top).</p>
  
  <p>To make the other navbar fit under the other, I used a margin-top. My problem is that this margin top is not responsive, if you increase or decrease the screen size, the navbar does not fit perfectly under the other.</p>
  
  <p>Is there a way to fit them correctly or calculate the necessary margin top?</p>
  
  <p><a href="https://www.codeply.com/p/2TSOM6lWEM" rel="nofollow noreferrer">DEMO</a></p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;nav class="navbar navbar-expand-md navbar-light bg-white MyNavBar fixed-top" &gt;
          &lt;div class="navbar-collapse collapse w-100 order-1 order-md-0 dual-collapse2" id="dual-collapse2"&gt;
              &lt;ul class="navbar-nav mr-auto"&gt;
                  &lt;li class="nav-item active"&gt;
                      &lt;a class="btn"&gt;&lt;img src="home.svg"&gt;&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="mx-auto order-0"&gt;
              &lt;a class="btn"&gt;&lt;img src=".logo-home.svg"&gt;&lt;/a&gt;
              &lt;button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#dual-collapse2"&gt;
                  &lt;span class="navbar-toggler-icon"&gt;&lt;/span&gt;
              &lt;/button&gt;
          &lt;/div&gt;
          &lt;div class="navbar-collapse collapse w-100 order-3 dual-collapse2" id="dual-collapse2"&gt;
              &lt;ul class="navbar-nav ml-auto"&gt;
                  &lt;div class="row"&gt;
                  &lt;li class="nav-item"&gt;
                   &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="nav-item"&gt;
                        &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="nav-item"&gt;
                       &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="nav-item"&gt;
                        &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="nav-item" style="width: 57px;"&gt;
                       &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/div&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/nav&gt;
  &lt;nav class="navbar navbar-expand-md navbar-light bg-white fixed-top Mytoolbar" style="margin-top: 74px;"&gt;
        &lt;div class="navbar-collapse collapse w-100 order-1 order-md-0 dual-collapse22" id="dual-collapse22"&gt;
            &lt;ul class="navbar-nav mr-auto" id="dual-collapse22"&gt;
              &lt;li class="nav-item folder_category"&gt;
                 &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="nav-item btn-upload"&gt;
                &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
              &lt;/li&gt;
            &lt;/ul&gt;
        &lt;/div&gt;
        &lt;div class="mx-auto order-0"&gt;
          &lt;button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#dual-collapse22"&gt;
            &lt;span class="navbar-toggler-icon"&gt;&lt;/span&gt;
        &lt;/button&gt;
          &lt;ul class="navbar-nav navbar-collapse collapse w-100 order-3" id="dual-collapse22"&gt;
            &lt;li class="nav-item btn-upload"&gt;
                &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="nav-item btn-upload"&gt;
                &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
  
        &lt;/div&gt;
        &lt;div class="navbar-collapse collapse w-100 order-3 dual-collapse22" id="dual-collapse22"&gt;
            &lt;ul class="navbar-nav ml-auto"&gt;
             &lt;li class="nav-item btn-upload"&gt;
                &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="nav-item"&gt;
                &lt;a class="nav-link"&gt;
              &lt;/a&gt;
              &lt;/li&gt;           
              &lt;li class="nav-item"&gt;
                &lt;a class="toggle-third nav-link"&gt;
                  &lt;img src="ra.svg" &gt;
                &lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="nav-item btn-upload"&gt;
                &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="nav-item btn-upload"&gt;
                &lt;a class="nav-link btn"&gt;sdfsdfsdfsdfsdfsdfsdfsdfsdfs&lt;/a&gt;
              &lt;/li&gt;
            &lt;/ul&gt;
        &lt;/div&gt;
    &lt;/nav&gt;
  </code></pre>