Currently I have create 2 css file , to simplify : the main difference between them are:

print.css

@page {
  size: landscape;
}

print_single.css

@page {
  size: portrait;
}

For the html file , it quote one of the css first

<link rel="stylesheet" id ="printCSS" href="css/print.css" type="text/css" media="print" />

Then if it is printing single page , I use jquery to change the path of the css file, otherwise , it will print in landscape :

    $(doc).ready(function(){
      $('#singlePrint').click(function(){
      $('#printCSS').attr('href','css/print_single.css');
    });    
});

The problem is , it seems only work in Chrome, I tried it on firefox and ie, the css file path is changed, but the css file is not reload , how to fix the problem ? thanks.

Currently I have create 2 css file , to simplify : the main difference between them are:

print.css

@page {
  size: landscape;
}

print_single.css

@page {
  size: portrait;
}

For the html file , it quote one of the css first

<link rel="stylesheet" id ="printCSS" href="css/print.css" type="text/css" media="print" />

Then if it is printing single page , I use jquery to change the path of the css file, otherwise , it will print in landscape :

    $(doc).ready(function(){
      $('#singlePrint').click(function(){
      $('#printCSS').attr('href','css/print_single.css');
    });    
});

The problem is , it seems only work in Chrome, I tried it on firefox and ie, the css file path is changed, but the css file is not reload , how to fix the problem ? thanks.

• javascript
• jquery
• html
• css
• printing

• 1 Not all of the @page properties are supported by all the browsers. developer.mozilla/en-US/docs/Web/CSS/@page – user2417483 Commented May 29, 2013 at 5:10
• Thanks. but I tried on IE8 and FX. latest ver. It should be support? – user1871516 Commented May 29, 2013 at 6:22

1 Answer 1

@page{size: landscape;} will not support in firefox. Alternative way is to use this in css class

-webkit-transform: rotate(-90deg); -moz-transform:rotate(-90deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);