title: Fixed size bootstrap container
body: <p>I am trying to make container fixed size <code>750px</code> for all sized windows. 
  Here is <code>HTML</code>:</p>
  
  <pre><code>&lt;div class="container"&gt;
          &lt;div class="thumbnail" &gt;
              ..........&lt;br/&gt;
              ..........
          &lt;/div&gt;
  &lt;/div&gt;    
  </code></pre>
  
  <p>and custom <code>CSS</code>:</p>
  
  <pre><code>   @media (min-width: 1200px) {
      .container {
          width: 750px;
      }
  
      @media (min-width: 992px) {
      .container {
          width: 750px;
      }
  
      @media (min-width: 768px) {
      .container {
          width: 750px;
      }
  </code></pre>
  
  <p>But the problem is when I am resizing window from big to small at some point size of <code>thumbnail</code> is getting a little larger and then reverses to its initial size. </p>
  
  <p>Here is a fiddle <a href="http://jsfiddle.net/Wy22s/718/" rel="nofollow">http://jsfiddle.net/Wy22s/718/</a> . You can just resize browser window or slide inner window in fiddle itself to left and then to right to reproduce this behavior.</p>
  
  <p>I have tried to add another div with <code>row</code> class. Tried combinations with <code>col-sm</code>, <code>col-md</code> etc, but I can not manage to achieve desired behavior. How can I fix this so the container/thumbnail size stays the same?</p>