title: Overlaying Ddivs without Absolute?
body: <p>I have a ten content divisions within a container, I need them to overlap but I also need the content divs to remain children of the parent div as I need the container div to follow thier heights.</p>
  
  <p>The content divs are currently positioned off screen and the container they are in have overflow:hidden; and will be called in by an external jquery script. </p>
  
  <p>I have z-indexed each div to be postioned in numerical order 1-10.</p>
  
  <p>Is there a way to achieve this? This is the main class I am using for the ten content divs,</p>
  
  <pre><code>.panel {
     width:85%;
     padding:2%;
     margin:3%;
     right:-100%;
  
         position: relative;
     z-index:100;
  
         color: white;
     background: #2F2F2F;
  
         -webkit-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
     box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
     border-radius: 1% 1% 1% 1%;
     border-radius: 5px;
  }
  </code></pre>