title: bootstrap justify-content-between not working in header
body: <p>i'm trying to make a header that when on pc is a normal nav and when on a smaller device (like phone etc.) becomes a burger nav. now the burger nav is working (only need to make it so that whenever I get on a smaller device it gets shown and the other one gets d-none)</p>
  <p>now the problem is with my normal nav, whenever I try to justify content between so that the links space out evenly it just doenst wanna work and I get default block display</p>
  <p>here's the code that needs fixing:</p>
  <pre><code>&lt;div class=&quot;header&quot;&gt;
          &lt;nav class=&quot;navbar navbar-light&quot;&gt;
              &lt;div class=&quot;burger-nav d-none&quot;&gt;
                  &lt;a class=&quot;navbar-brand&quot; href=&quot;#&quot;&gt;
                      &lt;h1 id=&quot;logo&quot;&gt;&lt;span class=&quot;h1yellow&quot;&gt;Crypto&lt;/span&gt;&lt;span class=&quot;h1white&quot;&gt;Mania&lt;/span&gt;&lt;/h1&gt;
                  &lt;/a&gt;
                  &lt;button class=&quot;navbar-toggler&quot; type=&quot;button&quot; data-toggle=&quot;collapse&quot; data-target=&quot;#navbarNav&quot; aria-controls=&quot;navbarNav&quot; aria-expanded=&quot;false&quot; aria-label=&quot;Toggle navigation&quot;&gt;
                      &lt;span class=&quot;navbar-toggler-icon&quot;&gt;&lt;/span&gt;
                  &lt;/button&gt;
                  &lt;div class=&quot;collapse navbar-collapse&quot; id=&quot;navbarNav&quot;&gt;
                      &lt;ul class=&quot;navbar-nav&quot;&gt;
                          &lt;li class=&quot;nav-item active&quot;&gt;
                              &lt;a class=&quot;nav-link&quot; href=&quot;#&quot;&gt;Login&lt;span class=&quot;sr-only&quot;&gt;(current)&lt;/span&gt;&lt;/a&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class=&quot;normal-nav d-flex justify-content-between&quot;&gt; &lt;!-- this part doesnt work --&gt;
                  &lt;ul class=&quot;navbar-nav&quot;&gt;
                      &lt;li class=&quot;nav-item active &quot;&gt;
                          &lt;a class=&quot;nav-link&quot; href=&quot;#&quot;&gt;Home &lt;span class=&quot;sr-only&quot;&gt;(current)&lt;/span&gt;&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li class=&quot;nav-item active&quot;&gt;
                          &lt;h1 id=&quot;logo&quot;&gt;&lt;span class=&quot;h1yellow&quot;&gt;Crypto&lt;/span&gt;&lt;span class=&quot;h1white&quot;&gt;Mania&lt;/span&gt;&lt;/h1&gt;
                      &lt;/li&gt;
                      &lt;li class=&quot;nav-item active &quot;&gt;
                          &lt;a class=&quot;nav-link&quot; href=&quot;#&quot;&gt;Login &lt;span class=&quot;sr-only&quot;&gt;(current)&lt;/span&gt;&lt;/a&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
          &lt;/nav&gt;
      &lt;/div&gt;
  </code></pre>
  <p>this is the whole nav but I put a little comment where the problem is. If anyone sees anything please let me know.</p>