title: display: relative error: invalid property value when width and height of parent are set
body: <p>I'm trying to make my h2 text "hover" above my images but I'm not sure what I'm doing wrong. Developer Tools in chrome says that the display: relative is an invalid property value and I'm not sure why. I'm setting my h2 text as absolute and setting top/left at 0px but the text is still underneath the image. Please help.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="cta-wrapper"&gt;
      &lt;div class="cta"&gt;
          &lt;img src="Photos/mypedal.png"&gt;
          &lt;a href="Products/productroom.php"&gt;&lt;h2&gt;Product Room&lt;/h2&gt;&lt;/a&gt;
      &lt;/div&gt;
      &lt;div class="cta"&gt;
          &lt;img src="Photos/signup.png"&gt;
          &lt;a href="Users/createaccount.php"&gt;&lt;h2&gt;Sign Up&lt;/h2&gt;&lt;/a&gt;
      &lt;/div&gt;
      &lt;div class="cta"&gt;
          &lt;img src="Photos/features.png"&gt;
          &lt;a href=""&gt;&lt;h2&gt;Features&lt;/h2&gt;&lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.cta-wrapper {
      width: 960px;
      margin: 0 auto;
      margin-top: 80px;
  }
  
  .cta {
      display: relative;
      float: left;
      width: 200px;
      height: 200px;
      margin: 0px 60px;
  }
  
  .cta a {
      display: absolute;
      top: 0;
      left: 0;
      z-index: 2;
  }
  
  .cta h2 {
      display: absolute;
      text-decoration: none;
      color: #BBBBBB;
  }
  
  .cta img {
      top: 0px;
      left: 0px;
  }
  </code></pre>