I am struggling to print a webpage in landscape orientation using the chrome browser, but I don't have control over the page's settings.
You can see the issue discussed here:
Chrome Print dialogue not offering fit to page, landscape, other printing options
This problem has been persisting for some time now.
Fortunately, a helpful commenter suggested a CSS solution to resolve this issue.
By adding the following CSS code to your webapp, you can fix this problem. Google will display layout options after implementing this fix.
@page { size: landscape; }
I was considering using developer tools to add this CSS code, but my unfamiliarity with CSS is hindering me from making it work.
Can someone provide guidance on how and where exactly to include this CSS in the page's style using dev tools to force it into landscape orientation? I understand how to add CSS following these instructions, but I suspect I might be placing it incorrectly.
Although I couldn't find a style requesting portrait mode to modify or remove, I believe there are numerous ways to accomplish this that I am unaware of.
EDIT:
Thanks to @Rojo's suggestion, I managed to utilize the technique outlined here to add the necessary CSS. Furthermore, by referring to this resource, I converted the code into a snippet for easy reusability on any problematic pages.
Below is the code snippet:
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '@page { size: auto; }';
document.getElementsByTagName('head')[0].appendChild(style);