I am currently trying to build a coupon system, The coupon has several informations on it (Address, name, google map, a QR code etc) Right now Iam trying to use a button in order to print the coupon only. The coupon is generated on a white page only the body the container DIV and a printing button exist on the page. The QR code is generated using a jquery plugin. My main problem is that no css styles are attached to the printing material although I have made the following statement on my header
<link href="/media/css/coupon.css" rel="stylesheet" media="screen" type="text/css" />
<link rel="stylesheet" href="/media/css/coupon.css" type="text/css" media="print" />
Also, I am seeking for a solution in order to force the coupon to be printed on landscape mode as the container DIV is too large for a single page on portrait mode. You can take a look on my live example over here
I have used for testing Chrome, Mozilla and Opera with OSX but still no luck.