Printing CSS Backgrounds - the Wrong Way

gistfile1.html

<style>
	* {
		font-family: Arial, Verdana, Georgia, 'Times New Roman';
		color: #646464;
	}
	.couponWrapper {
		width: 412px; height: 215px; border: 2px dashed #000; position: relative;
	}
	.couponHeader {
		position: absolute;
		left: 1px;
		top: 0px;
		z-index: 3;
		font-size: 20px;
		color: #000;
		font-weight: bold;
		background: #aadefa;
		width: 387px;
		padding: 12px;
	}
	.couponExpiry {
		font-size: 10px;
		position: absolute;
		width: auto;
		right: 10px;
		bottom: 7px;
		z-index: 3;
		line-height: 12px;
	}
	.couponRightColumn {
		width: 204px;
		height: 165px;
		position: absolute;
		right: 0px;
		top: 49px;
		z-index: 2;
		background: #efefef;
		padding: 0px 4px 0 12px;
	}
	.couponRightColumn h3 {
		margin: 0 0 4px 0; color: #333; font-size: 16px; padding: 0;
	}
	.couponRightColumn p {
		font-size: 12px;
		color: #646464;
		line-height: 1.5em !important;
	}
	.couponLogo {
		position: absolute;
		left: 6px;
		top: 50px;
	}
</style>
<div class="couponWrapper">
	<div class="couponHeader">MASSIVE WIDGET SALE</div>
	<div class="couponRightColumn">
		<p>All our widgets are on sale now! Get 20% off your order with this coupon.</p>
		<div class="couponExpiry">April 30/2012</div>
	</div>
	<div class="couponLogo"><img src='http://www.egoant.com/images/EgoMPoneLogo.png'/></div>
</div>