User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:49.0) Gecko/20100101 Firefox/49.0 Build ID: 20160722004032 Steps to reproduce: 1. Plot route in Maps from Albuquerque, NM to Telluride, CO 2. Choose the route via US 550 North. 2. Attempt to print directions. 3. View directions in PDF. Actual results: Directions page was malformed, with first and third page being nearly blank, and the page with information on it was cropped to be unusable. See attached PDF. Expected results: Document should have two pages of directions with no blank pages.

seems Bug 534182

I am having this same problem with firefox 47.0.1 Printing any google map directions results in first and last page blank. This only occurs in Firefox. Tried IE11 and google map directions print properly

This is a version of bug 939897 (as noted in bug 939897 comment 7). Google Maps printed directions are contained within a wrapper-element (with class="widget-pane-section-listbox-root") that is a column-oriented flex container: >.widget-pane-section-listbox-root { > display:flex; > flex-direction:column; > height:100% >}

Assigning per dholbert, this is a flexbox fragmentation bug.

We should absolutely fix this (via bug 939897), but it's complex to fix correctly/comprehensively, so in the interests of giving our users a better experience in the very-near term, we should reach out to Google Maps to see if they can avoid triggering this bug for our mutual users. (As it happens, the code that they added which triggers this bug seems to be completely unnecessary, as far as I can tell, and can be removed without any side effects [besides this bug going away]. See https://github.com/webcompat/web-bugs/issues/3727 for more details -- I filed that to cover webcompat outreach.)

(Note that the classname for the problematic styles here -- quoted in comment 5 -- has changed slightly. It's no longer "widget-pane-section-listbox-root" -- now the relevant styles are: > .section-listbox-root{display:flex;flex-direction:column;height:100%}

This seems to be fixed.

Tested with Firefox 50.1.0 and the issue appears to have been fixed

Yeah, Google seems to have added the following CSS rule, which overrides the CSS mentioned in comment 9: > .print-mode .section-listbox-root { > display:block; > height:auto > } That avoids the problem here. Hooray!

Reclassifiying as Tech Evangelism, since this was fixed in Google Maps' code, rather than in Firefox's code. (There is a Firefox fix that still needs to happen to avoid this problem generally, but that's tracked in bug 939897.)