title: Navbar in jQuery Mobile
body: <p>I've this navbar at the footer</p>
  
  <pre><code>&lt;footer data-role="footer"&gt;
      &lt;div data-role="navbar" data-iconpos="top"&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;a href="a.html" class="ui-btn-active" data-icon="star"&gt;Fav&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="b.html" data-icon="back"&gt;Recent&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="a.html" data-icon="delete"&gt;Contacts&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="b.html" data-icon="grid"&gt;Keypad&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="a.html" data-icon="delete"&gt;Voicemail&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;&lt;!-- /navbar --&gt;
  &lt;/footer&gt;
  </code></pre>
  
  <p><a href="http://jquerymobile.com/test/#/test/docs/toolbars/docs-navbar.html" rel="nofollow noreferrer">http://jquerymobile.com/test/#/test/docs/toolbars/docs-navbar.html</a> says, the nav bar can take upto 5 items in one line but here, the nav items are assigned with 3 columns layout and the last 2 li items falls down in the second line.</p>
  
  <p>Did I miss something??</p>
  
  <p><img src="https://i.stack.imgur.com/pNrk5.png" alt="enter image description here"></p>