New Image Replacement Technique & Positioned Containers

When using the new image replacement technique on absolute positioned elements within fixed/absolute positioned containers, the container must have a width set.

HTML

<p><a href="http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/">New Image Replacement</a> - When used on absolute positioned elements within fixed/absolute positioned containers, the container must have a width set (in IE and Webkit).</p>

<div class="container">
    <a href="#" class="button">Button</a>
</div>

CSS

body {
    padding: 10px;
}
.container {
    border: 1px solid;
    height: 100px;
    left: 0;
    position: absolute;
    top: 20%;
    width: 100%;
}
.button {
    background: url(http://placehold.it/200x50);
    display: block;
    height: 50px;
    left: 20px;
    position: absolute;
    top: 20px;
    width: 200px;
    
    /* new image replacement technique */
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}