It's not easy to override websites that use print style sheets or resolution-based responsive style sheets because the CSS tends to differ considerably among sites.

Do you have any add-ons that might be influencing this? You could test in Firefox's Safe Mode. In Safe Mode, Firefox temporarily deactivates extensions, hardware acceleration, and some other advanced features to help you assess whether these are causing the problem.

If Firefox is not running: Hold down the Shift key when starting Firefox.

If Firefox is running: You can restart Firefox in Safe Mode using either:

• "3-bar" menu button > "?" button > Restart with Add-ons Disabled
• Help menu > Restart with Add-ons Disabled

and OK the restart.

Both scenarios: A small dialog should appear. Click "Start in Safe Mode" (not Refresh).

Any improvement?

Interesting. The auto site uses width detection to switch between its desktop and mobile layouts. If the width is 768px or more, you get desktop view. If it's less, you get a mobile layout.

I use pdfFactory, which is fantastic for testing (it's not free, but you can use the trial edition for what I'm doing with that site). At letter size, I get the desktop site printed out. However, if I change the paper size in pdfFactory to A5, then I get the mobile site on the printout.

What paper size is Firefox using for your printer?

You may have accidentally zoomed web page(s). Reset the page zoom on pages that cause problems.

• View -> Zoom -> Reset (Ctrl+0/Command+0 (zero))

• http://kb.mozillazine.org/Zoom_text_of_web_pages

"Just in case" this is useful, I will copy/paste my standard spiel here:

If Firefox is not using the whole sheet of paper, or otherwise misunderstands what is contained in your printer's paper tray(s), that can be caused by Firefox having extracted the wrong paper size settings from Windows when reading the print driver data. Clearing it involve some heavy clicking:

(1) In a new tab, type or paste about:config in the address bar and press Enter. Click the button promising to be careful.

(2) In the search box above the list, type or paste print and pause while the list is filtered

(3) For each setting that specifically mentions the problem printer, right-click and Reset it. The fastest way is to right-click with the mouse and then press the r key on the keyboard with your other hand.

Here's a possible shortcut: In a couple threads there was a mysterious value for the preference printer_printer_name.print_paper_data and merely changing that to 1 fixed the paper size problem all by itself.

• Brother printer: user had 256, changed it to 1
• HP printer: user had 141, changed it to 1

To edit the value of that preference, you can doubling-click it or use right-click>Modify, then type the new value, and click OK.

It prints most pages fine, it's only an issue on websites that change dynamically based on the width of the browser.

As the browser is on a 1920x1080 screen, everything appears fine on screen.

as soon as Print Preview is opened it goes to a mobile view (Only in the print preview window)

if I forcibly zoom the view out (to make everything smaller in the print preview window) or switch the print preview to Landscape mode, SOMETIMES it will print the proper page and not the mobile view.

and as for the first reply, tested with multiple printers (HP, Lexmark, Brother) across multiple computers (Work, Home) and have tested all with addons disabled. same results in both.

Most sites affected with this issue also have the same issue in Chrome.

Some older versions of Internet Explorer don't have this issue. - but seriously, stuff having to use IE on a Windows XP machine just to be able to print correctly.

jscher2000 said

What paper size is Firefox using for your printer?

A4, which is the standard page size here in Australia. (We don't use "letter" here)

Hmm, if I change from letter to A4, I get mobile instead of desktop! What is the math here? It's very odd.

The auto site uses the Bootstrap framework and this is a known issue with that framework that they have documented and decided they won't fix:

• http://getbootstrap.com/getting-started/#support-printing
• https://github.com/twbs/bootstrap/issues/12078

I started looking at their style sheet and it's a morass! Or more to the point, it has so many rules for different dimensions that I don't see a quick way to fix it.

Could I suggest a possible workaround? That would be to install a PDF printer driver and print to letter sized PDFs. If you need the document on actual paper, I believe Adobe Reader can resize it to A4. You'll lose some height in the bargain but that might be better than the current situation.

As this also affects government websites that i am forced to use on a daily basis, a complicated workaround which only works for some sites (the PDF solution doesn't work with MyGov) the only real option is to find a different browser that doesn't have the issue.

Annoyingly, that's very specific versions of IE or Safari.

The only workaround that actually works in FF i've found is an addon, called "Capture and Print" You select an area, it makes it into a PNG and prints it. However, sites like this Firefox support page, with the floating "Mozilla Support" bar, will have that bar floating in random positions, usually halfway through the page you're trying to print. or repeated at the top of every page printed.

Ment to dump a link. MyGov, which prints in MobileView, even with the paper size set to "Letter" https://www.humanservices.gov.au/customer/dhs/centrelink

DazzaJay said

MyGov, which prints in MobileView, even with the paper size set to "Letter" https://www.humanservices.gov.au/customer/dhs/centrelink

This is very intentional on their part. It's not because of screen width, they have sprinkled print-specific rules throughout their style sheet to tweak the layout for printing:

@media print {
	.hidden-phone {
		display : none !important ;
	}
	.print-only, .visible-print {
		display : block !important ;
	}
} 
@media print {
	a {
		color : #000 !important ;
	}
} 
@media print {
	.nav, .workbench-info-block, #navbar-administration, .messages {
		display : none !important ;
	}
} 
@media print {
	.alert {
		color : black !important ;
		border-color : black !important ;
	}
} 
@media print {
	.page-footer {
		display : none;
	}
} 
@media print {
	.crest {
		float : left !important ;
		margin : auto;
		width : auto;
	}
	#banner ul {
		display : none !important ;
	}
} 
@media print {
	.toc {
		display : none;
	}
} 
@media print {
	.rsbtn {
		display : none;
	}
} 
@media print {
	.dhs-slider, .slick-track {
		display : none !important ;
	}
} 

Not easy to override. There may be versions of IE that didn't allow @media print rules, but I think you would have to go back earlier than IE8, which would not be a good idea. Safari for Windows was discontinued a long time ago, so I've never tried it.

Agreed on the image capture option. I keep Fireshot for emergencies: https://addons.mozilla.org/firefox/addon/fireshot/ (there are some non-free options on its menu, but Capture entire page and save (to PNG) works. I then print from the Windows Paint program, which has its own annoyances...

The problem is, these idiots (Of course they are idiots, they are the Australian government) have made a whole bunch of pages, implemented FLOATING PRINT BUTTONS on the pages, with information that the user MUST PRINT. but when you do, it comes out as a single line of text "You cannot view this on a mobile device"

what I need is some kind of decent override, or an addon that can just grab a shot of an entire site, and print it. (And split it over many pages if required)

Or, I have to continue with the workaround I'm currently using. IE6 on a Windows XP laptop.

DazzaJay said

The problem is, these idiots (Of course they are idiots, they are the Australian government) have made a whole bunch of pages, implemented FLOATING PRINT BUTTONS on the pages, with information that the user MUST PRINT. but when you do, it comes out as a single line of text "You cannot view this on a mobile device"

I don't see that problem on the home page. Is there a public page demonstrating that which you could link to?

It may be same issue as the auto site.

For the auto site, you can use a bookmarklet to strip out all the @media rules, which appears to leaves a basic default layout that is not responsive to page width. I don't know how many sites will print better. (On a page I tested on the main Bootstrap site, the sidebar still isn't positioned on the right side of the printout after applying the change, but the printout has the screen colors instead of being in pure black and white.)

Can you give it a try?

REMOVE ALL @MEDIA RULES

One-time Setup:

(A) Select and copy the following script:

javascript:var s=document.styleSheets,c,r,i,j; for(i=0; i<s.length; i++){c=s[i].cssRules; for(j=c.length;j>0;j--){r=c[j-1].cssText; if(r.indexOf('@media')===0) s[i].deleteRule(j-1);}} void 0;

(B) Right-click a spot on the Bookmarks Menu or Bookmarks Toolbar where you would like to save the script and choose New Bookmark

(C) In the Location box, paste the script, then in the Name box, enter something you'll remember like No@media and click the Add button

To use the bookmarklet:

While viewing the page that needs modification, click the bookmarklet button. You likely will see the layout change a bit. Check for an improvement in Print Preview.

I'm sure there is a better way to deal with the problem, but two hours is about all I can put into this today.

jscher2000 said

I don't see that problem on the home page. Is there a public page demonstrating that which you could link to? It may be same issue as the auto site.

Unfortunately, no, as it only happens on pages while logged in, with pages handling things like welfare payments, bank account details, etc, so I can't even share a screenshot without blurring over 90% of it out.

Basically, both firefox's print button, and the web page's built-in floating print button, both end up printing the same thing: "You cannot view this on a mobile device"

I will give the @media rules a shot when I have some free time (Really busy)

but still, this is just two of many websites that when attempting to print, bust it to a Mobile view. (And why MY website has a separate subdomain for mobile view - no dynamic changing bullshit on my site)

Also, forgot to mention:

The FireShot addon you linked before is similar to the one i was using (Capture & Print) - However Fireshot can split the selected area over multiple pages. It's quite good. Still annoying to have to use an addon to do something as simple as print what is displayed on screen the same as it is displayed on screen.