title: Horizontal aligning navbar elements on mobile - bootstrap 3
body: <p>I want to display the responsive view's navbar with following sequence of elements</p>
  
  <blockquote>
    <p><strong>Menu</strong> (button) -- <strong>BRAND</strong> (Centered) -- <strong>Search</strong> (Icon) -- <strong>Login</strong> (Icon)</p>
  </blockquote>
  
  <p>I have tried a lot of ways to get it done but no success. currently they come in three rows when seen in mobile resolution.</p>
  
  <p>Here is the code in <strong>></strong> <a href="http://www.bootply.com/125710" rel="nofollow">bootply</a></p>
  
  <p>For the desktop view, the elements are aligned as per the required sequence. </p>
  
  <p>Is it possible to align them all in the specified sequence for mobile view?</p>