title: div "top" bug IE and everything else. Big problem
body: <p>I am new in CSS so please help me in this problem. I hope to describe it wright.</p>
  
  <p>I am making div named content where my site content is. I made it with z-index:-1; so an image to be over this div. But in Chrome, FF and safari, content became inactive. I cant select text , click on link and write in the forms. So I tried with positive states in the z-index but IE don't know what this means. Damn. So I decided to make conditional div. Here is the code:</p>
  
  <pre><code>.content
  {
      background:#FFF;
      width:990px;
      position:relative;
      float:left;
      top:50px;
  }
  .content_IE
  {
      background:#FFF;
      width:990px;
      position:relative;
      float:left;
      top: 50px;
      z-index:-1;
  }
  </code></pre>
  
  <p>and here is the HTML:</p>
  
  <pre><code>&lt;!--[if IE 7]&gt;
      &lt;div class="content_IE" style="height:750px;"&gt;
          &lt;![endif]--&gt;
              &lt;div class="content" style="height:550px;"&gt;
  </code></pre>
  
  <p>Everything is fine with the z-index but the problem is that if there is no top in .content class everything looks fine in IE but there is no space in the other browsers. If i put back the top:50px; there onother 50px like padding in the .content_IE class. I mean that the page looks like I've put top:50px; and padding-top=50px;. I've try everything like margin-top:-50px; padding-top:-50px; and stuff like this but I am still in the circle. It look fine only if there is no <strong>top</strong> option in <strong>.content</strong> class. Please help.</p>