title: Bootstrap resizing and auto-collapsing
body: <p>I'm currently building the website for my brand new creation and - since I've never been such a CSS guru - I need your lights!</p>
  
  <ul>
  <li><p>There is a central screenshot (with the editor inside). When the window is at full size, the screenshot appears fine and centered as it's supposed to be. When I start reducing the width of the window, the image seems as if it's moving to the right. Would it be possible to keep it where it initially is, and resize it when the window resizes?</p></li>
  <li><p>On resizing, the <code>navbar</code> menu collapses and a toggle button (mobile-style) is created in its place. Is there any way to disable this? Or, at least, not trigger at that stage but at a smaller width (while the <code>navbar-brand</code> is still fitting)?</p></li>
  </ul>
  
  <p><strong>That's the core HTML section:</strong></p>
  
  <pre><code>    &lt;div class="navbar navbar-inverse navbar-fixed-top"&gt;
          &lt;div class="container-fluid"&gt;
              &lt;div class="navbar-header"&gt;
                  &lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" &gt;
                      &lt;span class="sr-only" style="color:black;"&gt;Toggle navigation&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;
                      &lt;span class="icon-bar"&gt;&lt;/span&gt;
                  &lt;/button&gt;
                  &lt;a class="navbar-brand" href="#"&gt;&lt;img src="images/logo.png" width="40"&gt;&amp;nbsp;&amp;nbsp;Peppermint&lt;/a&gt;
              &lt;/div&gt;
              &lt;div class="collapse navbar-collapse"&gt;
                  &lt;ul class="nav navbar-nav navbar-right"&gt;
                      &lt;li class="active"&gt;&lt;a href="#"&gt;&lt;i class="fa fa-home"&gt;&lt;/i&gt;&amp;nbsp;&amp;nbsp;Overview&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;&lt;i class="fa fa-question-circle"&gt;&lt;/i&gt;&amp;nbsp;&amp;nbsp;Documentation&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="http://sites.fastspring.com/insili/product/peppermint" target="_blank"&gt;&lt;i class="fa fa-shopping-cart"&gt;&lt;/i&gt;&amp;nbsp;&amp;nbsp;Buy&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="mailto:info@insili.co.uk?subject=Peppermint Support Request"&gt;&lt;i class="fa fa-life-ring"&gt;&lt;/i&gt;&amp;nbsp;&amp;nbsp;Support&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="header"&gt;
          &lt;div class="container" &gt;
              &lt;div class="row-fluid" style="text-align:center;"&gt;
                  &lt;img src="images/screenshot2.png" &gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p><strong>And here's the live page:</strong> <a href="http://www.osxpeppermint.com" rel="nofollow">http://www.osxpeppermint.com</a></p>
  
  <hr>
  
  <p>Thanks a lot!</p>