title: How to absolutely position Bootstrap navbar within div without wrapping
body: <p>I'm trying to overlay my navbar onto a background image. The way I'm doing this is nesting it within a div, and using absolute position. However, the <code>navbar-header</code>/<code>navbar-brand</code> portion causes the rest of the navbar to wrap onto a new line.</p>
  
  <p>Here's the example: 
  <a href="https://jsfiddle.net/qjxszebe/" rel="nofollow">https://jsfiddle.net/qjxszebe/</a></p>
  
  <p>I realize there are some other options about creating the background image, but I'd like to understand why this simple approach doesn't work.</p>
  
  <p>What I want is the fiddle above to be fixed such that the navbar is on a single line as you'd expect, not two lines.</p>
  
  <p><strong>Solution:</strong>
  Here's the working fiddle with the width: 100%: <a href="https://jsfiddle.net/69yhavtj/" rel="nofollow">https://jsfiddle.net/69yhavtj/</a></p>