title: Angular 4 full image background
body: <p>I'm new to the angular framework and TypeScript and I came across this issue while i was creating a simple page.</p>
  
  <p>I wanted to give the page a full image background, but the background image would only appear behind the child elements (see image) of the the HTML-tag. So after a lot of trying and failing I tried to do the same thing but instead in an online html,css editor (see snippet). And this editor gave the expected and wanted result??? Am I missing a DOM element above the html or does angular 4 framework add another root???</p>
  
  <p><a href="https://i.stack.imgur.com/KXzDJ.png" rel="nofollow noreferrer">Current situation</a></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>html { 
      background: url(http://www.apicius.es/wp-content/uploads/2012/07/IMG-20120714-009211.jpg) no-repeat center center fixed; 
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
      &lt;body&gt;
          &lt;div&gt;
              &lt;h1&gt;Title&lt;/h1&gt;
              &lt;h3&gt;Subtitle&lt;/h3&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>