Scaling generated content in CSS.

Question

How do you scale an image added in :before or :after in CSS?

For example, I have a page which contains a book cover:

<span class="book">
    <img src="http://ecx.images-amazon.com/images/I/41t7xMPK%2B6L.jpg" />
</span>

I want to use CSS to make it look more like a book, rather than just a cover. I can use :before to add a second image to do this, but as all books vary in size, I need to be able to scale this image to fit the book cover.

I have tried

.book:before{
    content:url("/images/book.png");
    position:absolute;
    height:100%;
    width:100%;

}

but this doesn't work in scaling the image.