title: Unable to make background image full screen
body: <p>I am trying to make a website using parallax. </p>
  
  <p>I am having troubles with CSS. Below is the HTML:</p>
  
  <pre><code>&lt;div id="skrollr-body"&gt;
  
          &lt;div class="subnav"&gt; 
              &lt;ul  id="nav"&gt;
                  &lt;li&gt;&lt;a href="#home"&gt;Home&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#foo"&gt;Foo&lt;/a&gt;&lt;/li&gt;
  
              &lt;/ul&gt; 
          &lt;/div&gt;
  
  
              &lt;div id="home" class="centered" data-0="height:100%;" data-1000="height:0%;" &gt; 
                  &lt;div class="zebra"&gt;
                       &lt;div class="contentWrap"&gt;
  
                            test
  
                       &lt;/div&gt;         
                  &lt;/div&gt; 
              &lt;/div&gt;
  
  
              &lt;div id="foo" class="centered" data-1000="height:100%;" data-2000="height:0%;"&gt;
                  &lt;div class="world"&gt;
                           &lt;div class="contentWrap"&gt;
  
                                test
  
                           &lt;/div&gt;         
                   &lt;/div&gt; 
  
              &lt;/div&gt; 
  &lt;/div&gt;
  </code></pre>
  
  <p>and here is the css:</p>
  
  <pre><code>#home {  
      background: #dedede;
      height: 100%;
      z-index: 901;
  } 
  #foo{background: yellow; z-index:800;}  
  
  .zebra {
      background-image: url("/img/zebra-pattern.png");
      background-position: center center;
      background-repeat: repeat-x;
      background-size: cover;
      height: 100%;
      position: relative;
      width: 100%;
  }
  
  .world {
      background-image: url("/img/world.jpg");
      background-position: center center;
      background-repeat: repeat-x;
      background-size: cover;
      height: 100%;
      position: relative;
      width: 100%;
  }
  
  .contentWrap{ 
      position: absolute; 
      border: 1px solid red;
  }
  </code></pre>
  
  <p>My problem is if i dont put height explicitly, background image is not becoming full screen. </p>
  
  <p>any advice?</p>