title: bootstrap fixed navbar covers the whole screen when zooming in
body: <p>A bit silly yet slightly concerning problem. I have navbar fixed to the top with some elements inside. The problem is that if I zoom in with high percentage, elements in the navbar regroups so that whole screen is covered by the navbar. That would be allright if the topbar would not stay fixed rendering the whole page useless. Is there a way to "unfix" it after some zooming level is reached? (Ye and I am css noob). Here is markup of the navbar:</p>
  
  <pre><code>&lt;div class="navbar navbar-inverse navbar-fixed-top"&gt;
      &lt;div class="navbar-inner"&gt;
          &lt;div class="container-fluid"&gt;
              &lt;a class="brand" href="{% url home %}"&gt;Pavel Nováček&lt;/a&gt;
              &lt;ul class="nav"&gt;
                  {% load tag_library %}
                  {% set_current_urlname %}
                  &lt;li&gt;&lt;a href="{% url home %}" class=""&gt;&lt;img src="/static/web/img/cz.png"&gt;&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="{% url home %}" class="" style="padding-left: 0px"&gt;&lt;img src="/static/web/img/gb.png"&gt;&lt;/a&gt;&lt;/li&gt;
  
                  &lt;li class="{% if current_urlname == 'home' %}active{% endif %}"&gt;
                  &lt;a href="{% url home %}"&gt;&lt;strong&gt;Home&lt;/strong&gt;&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="{% if current_urlname == 'about-me' %}active{% endif %}"&gt;
                  &lt;a href="{% url about-me %}"&gt;&lt;strong&gt;About me&lt;/strong&gt;&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="{% if current_urlname == 'books' %}active{% endif %}"&gt;
                  &lt;a href="{% url books %}"&gt;&lt;strong&gt;Books&lt;/strong&gt;&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="{% if current_urlname == 'presentations' %}active{% endif %}"&gt;
                  &lt;a href="{% url presentations %}"&gt;&lt;strong&gt;Presentations&lt;/strong&gt;&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="{% if current_urlname == 'links' %}active{% endif %}"&gt;
                  &lt;a href="{% url links %}"&gt;&lt;strong&gt;Links&lt;/strong&gt;&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="{% if current_urlname == 'contact' %}active{% endif %}"&gt;
                  &lt;a href="{% url contact %}"&gt;&lt;strong&gt;Contact&lt;/strong&gt;&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
  
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>EDIT: it seems to be "a feature" of container-fluid.</p>