Printing landscape or portrait in FireFox and IE 8

javascript jquery html css printing

43,257

Solution 1

No application should depend on this feature to work cross browser right now because the CSS3 standard on page orientation for printing is still under implementation in most browsers.

For Google Chrome it works just fine: http://dev.activisual.net/test.html

Ultimately the decision of changing the orientation relays on the user during the printing process (even if it works), so you could simply let the users know that they should print the page in landscape or portrait, but in general there won´t ever by a way to prevent the users from changing the orientation while printing on desktop browsers.

Here is a bug report for FF reported very recently: https://bugzilla.mozilla.org/show_bug.cgi?id=851441

You can read the accepted answer on this question for reference: Landscape printing from HTML

Solution 2

As the MDN reference says:

You can only change the margins, orphans, widows, and page breaks of the document. Attempts to change any other CSS properties will be ignored.

As far as supplying you with markup that achieves what you want, that would be outside the bounds of what's allowed on SO. In addition, it could be a bit of work since you are wanting a two generation back version of IE to attempt to perform as well as a current generation Firefox.

Solution 3

Page printing layout is portrait by default, to change to landscape and see the difference try the below.

The the below css code is supported since version 19.0 , try it, it should solve your problem: For IE8 you should use HTML5 directive in your html

<!doctype html>

Css code :

@media print{@page {size: landscape}}

Firefox: https://developer.mozilla.org/en-US/docs/Mozilla_CSS_support_chart Firefox support

IE http://msdn.microsoft.com/en-us/library/hh781508(v=vs.85).aspx enter image description here

43,257

Author by

user1871516

Updated on July 09, 2022

Comments

user1871516 almost 2 years
Currently I am using FireFox latest version and IE8

To change the orientation of printing , I used
```
@page {
  size: portrait;
}
```
in my css file. @page reference

Although it claims that the @page is supported in both browsers , after my testing it is not working at all besides Chrome. I would like to know how to print the page in different orientation in FireFox / IE8.
user1871516 almost 11 years

Thanks for your help, why Chrome can specific the printing orientation by the CSS? Do they implement some feature ?
Aaa almost 10 years

Ultimately, while the decision lies on the user, there is nothing wrong with the website suggesting a reasonable default that the user can override, if they really want to. You are correct in that you cannot rely on CSS for this at all, at least at the moment. One year later, Chrome is still the only browser that seems to support it. On Firefox, the first bug for supporting @page and orientation was filed in 2001(!) - bugzilla.mozilla.org/show_bug.cgi?id=115199, and is still not implemented. I guess you better not hold your breath?