title: How to make a CSS3 chart with position:absolute; work in a box that has a display:inline-block;
body: <p>Please, no javascript.</p>
  
  <p>Imagine this if you will. A page that has hundreds of boxes with each box containing a joke, cite, image... (all boxes with a display:inline-block;).</p>
  
  <p>Now I'm trying to place A chart with a few components with position:absolute; and left: in one of the display:inline-block; boxes with no luck. The chart shows at the left side of the page with the next joke box underneath it.</p>
  
  <p>How do I control it?</p>
  
  <p>Cheers, All.</p>
  
  <p>Part 2 (my box code):</p>
  
  <pre><code>.boxDarth{
      border-radius:5px;
      border:1px solid #663810;
      box-shadow:-3px 5px 4px #000000;
      margin:6px 3px;
      padding:6px;
      display:inline-block;
  
      line-height:1.5;
      text-align:left;
      text-decoration:none;
      font-weight:lighter;
      letter-spacing:1.4;
      text-shadow:-1px 1px 1px #37363b;
      word-wrap:break-word;
  
      vertical-align:top;
      position:relative;
  }
  </code></pre>
  
  <p>The chart ccs is quite long. If what I provide here is not enough, and since I've never asked a question here; should I paste it here? upload a file?</p>
  
  <pre><code>.pie{
      position:absolute;
      width:100px;
      height:200px;
      overflow:hidden;
      left:150px;
      -moz-transform-origin:left center;
      -o-transform-origin:left center;
      -webkit-transform-origin:left center;
      transform-origin:left center;
  }
  </code></pre>