title: CSS center image in a clipped parent div
body: <p>How can I center an <code>img</code> in a parent <code>div</code> tag which is set to <code>overflow: hidden</code>. That is, what I want is to clip the image but clip on both the left/right so the middle of the image is shown.</p>
  
  <pre><code>&lt;div class='wrapper'&gt;
    &lt;img/&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Then styles something like:</p>
  
  <pre><code>.wrapper {
    position: absolute;
    /* position details here */
    overflow: hidden;
  }
  .wrapper img {
    height: 100%;
    margin-left: -??; //what here?
  }
  </code></pre>
  
  <p><code>-50%</code> would be the width of the parent, but I want the width of the img itself.</p>
  
  <p>Firefox supported CSS is acceptable.</p>