Force Navbar elements to stay in one line
<p>I wan't the elements of my <strong>Bootstrap Navbar</strong> to <strong>stay in one line</strong> at every width.</p>

<p>I know this question has already been asked <a href="https://stackoverflow.com/search?q=navbar+in+one+line">several times</a> and I've tried various solutions, but no one worked for my case.</p>

<p>Here's my code:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override"><code>#head-navbar {
  width: 100%;
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
}
.nav&gt;li {
  display: inline-block;
  white-space: nowrap;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /&gt;
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"&gt;&lt;/script&gt;


&lt;nav class="navbar navbar-inverse navbar-fixed-top navbar-collapse" id="head-navbar"&gt;
  &lt;ul class="nav navbar-nav"&gt;
    &lt;li&gt;&lt;a class="#" href="#"&gt;Home&lt;/a&gt;
    &lt;/li&gt;
    &lt;li&gt;&lt;a href="#"&gt;Page 1&lt;/a&gt;
    &lt;/li&gt;
    &lt;li&gt;&lt;a href="#"&gt;Page 2&lt;/a&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
  &lt;ul class="nav navbar-nav pull-right"&gt;
    &lt;li&gt;&lt;a href="#"&gt;DE&lt;/a&gt;
    &lt;/li&gt;
    &lt;li&gt;&lt;a href="#"&gt;IT&lt;/a&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
&lt;/nav&gt;</code></pre>
</div>
</div>
</p>

<p>I want my Navbar to look like this on a smaller screen:</p>

<p><a href="https://i.stack.imgur.com/UiHsD.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UiHsD.jpg" alt="enter image description here"></a><br>
and not like this:  </p>

<p><a href="https://i.stack.imgur.com/ZBeqM.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ZBeqM.jpg" alt="enter image description here"></a></p>