title: react-bootstrap: Nav without NavItem?
body: <p>Maybe I am just stupid or prejudiced, but I really really don't like <a href="https://react-bootstrap.github.io/components.html#navs" rel="nofollow noreferrer"><code>NavItem</code></a>. The fact that it is an <code>&lt;a&gt;</code> wrapped inside an <code>&lt;li&gt;</code> enforces a lot of rules that I don't want to abide by. I just want to create my own Navbar using the Bootstrap stylings, but with my own elements, like <code>&lt;Button&gt;</code>, <code>&lt;ButtonGroup&gt;</code>, maybe an unclickable image or even a search box.</p>
  
  <p>Which leads me to my question: What is the easiest way to get rid of <code>NavItem</code> and get (somewhat) properly styled, ordered elements?</p>
  
  <p>If I simply put a <code>&lt;li&gt;&lt;Button&gt;...&lt;/Button&gt;&lt;/li&gt;</code> in <code>&lt;Nav&gt;</code>, it complains about properties that are not expected by <code>&lt;li&gt;</code>. I tried replacing <code>&lt;Nav&gt;</code> with my own <code>&lt;ul&gt;</code> while copying all it's properties and it still did not work out well. I imagine, just playing around like that will eventually work but easily break in the future because I am not respecting some of <code>Navbar</code>'s design considerations.</p>
  
  <p>Is <code>Navbar</code> only to be used with <code>&lt;Nav&gt;</code> and links? If I want non- elements in my bar, do I have to do the whole thing from scratch? There must be a better solution...?</p>