title: Adding bootstrap css lets background image disappear
body: <p>I have a small problem adding a background image to my bootstrap site. I want the background image to be present over the whole page, so i choosed it to display at the html-tag. It's working fine, till i add the <code>bootstrap.min.css</code> file. Then my background disappear and the background stays white. </p>
  
  <p>Here are my <code>Index.html</code> and my own <code>style.css</code> files.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;title&gt;Title&lt;/title&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  
      &lt;link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"&gt;
      &lt;link rel="stylesheet" type="text/css" href="css/style.css"&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  
    &lt;div class="container-fluid fill"&gt;
      &lt;div id="content"&gt;
          &lt;a href="#" class="btn btn-info" role="button"&gt;Link Button&lt;/a&gt;
      &lt;/div&gt; &lt;!-- This one wants to be 100% height --&gt;
    &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>style.css</p>
  
  <pre><code>html {
        background-image: url('test.jpeg');
        background-size: 100% 100%;
      }
      #content {
          width: 100%;
          height: 100%;
          min-height: 100%;
          display: block;
          }
      html, body {
          height: 100%;
      }
  
      .fill { 
          min-height: 100%;
          height: 100%;
      }
  </code></pre>
  
  <p>The folder structure is like that </p>
  
  <pre><code>Index.html
  css
  |
  __style.css
  __test.jpeg
  </code></pre>
  
  <p>Do you have any suggestions what could be the problem ?</p>