title: Navbar Logo fixed center and top
body: <p>I have a navbar for bootstrap 4 and the nav-brand centered on computer window, but it will moving to dropdown when expand the toggle on mobile. Does there any way to make the brand fixed on top and center?</p>
  <p>my navbar code on html:</p>
  <pre><code>&lt;nav class=&quot;navbar navbar-expand-lg navbar-dark bg-dark fixed-top&quot;&gt;
  &lt;button class=&quot;navbar-toggler&quot; type=&quot;button&quot; data-toggle=&quot;collapse&quot; data-target=&quot;#navbarNavDropdown&quot; 
   aria-controls=&quot;navbarNavDropdown&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 justify-content-start&quot; id=&quot;navbarNavDropdown&quot;&gt;
     &lt;ul class=&quot;navbar-nav&quot;&gt;
        &lt;li class=&quot;nav-item dropdown&quot;&gt;
         &lt;a class=&quot;nav-link dropdown-toggle&quot; href=&quot;#&quot; id=&quot;navbarDropdownMenuLink&quot; role=&quot;button&quot; data- 
          toggle=&quot;dropdown&quot; aria-haspopup=&quot;true&quot; aria-expanded=&quot;false&quot;&gt;&lt;i 
          class=&quot;fas fa-store mr-3&quot;&gt;&lt;/i&gt;Product
           &lt;/a&gt;
  
      &lt;div class=&quot;dropdown-menu&quot; aria-labelledby=&quot;navbarDropdownMenuLink&quot;&gt;
        &lt;a class=&quot;dropdown-item&quot; href=&quot;...&quot;&gt;..&lt;/a&gt;
      &lt;/div&gt;
    &lt;/li&gt;
  
      &lt;li class=&quot;nav-item active&quot;&gt;
        &lt;a class=&quot;nav-link&quot; href=&quot;/&quot; style=&quot;color: papayawhip&quot;&gt;&lt;i class=&quot;fas fa-home mr-3&quot;&gt;&lt;/i&gt;Home 
        &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;a class=&quot;navbar-brand mx-auto&quot; href=&quot;/&quot;&gt;&lt;img src=&quot;.....&quot; style=&quot;max-height: 60px&quot; /&gt;&lt;/a&gt;
  
  
    &lt;div class=&quot;collapse navbar-collapse justify-content-end&quot; id=&quot;navbarNavDropdown&quot;&gt;
      &lt;ul class=&quot;navbar-nav&quot;&gt;&lt;li class=&quot;nav-item&quot;&gt;
          &lt;a&gt;...&lt;/a&gt;
      &lt;/li&gt;
    
      &lt;/ul&gt;
     &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>