I am trying to print a webpage (that I have no control over) in landscape orientation using the chrome browser.
As you can see here:
Chrome Print dialogue not offering fit to page, landscape, other printing options
This is a long standing issue.
However, one commenter suggested using css to fix the issue.
Adding following css to your webapp fixes this issue. Google shows Layout options after this fix.
@page { size: landscape; }
I was thinking I could perhaps use developer tools to add that bit of css in, but I am too unfamiliar with css to get it to work.
Can someone explain how/where exactly to add this to the page's style using dev tools to get it to be landscape? I can add css following these directions, but I suspect I am not adding it in the correct place.
I couldn't find a style which requested portrait to change or remove, but I am sure there are many ways to do that which I am unfamiliar with.
EDIT:
Per @Rojo I was able to use the method here to add the css. Further using this, I was able to make the code a snippet, so I can rerun it whenever I need to on any misbehaving page.
Here is the snippet code:
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '@page { size: auto; }';
document.getElementsByTagName('head')[0].appendChild(style);
You can just take this code and insert it into the console.
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = 'content';
document.getElementsByTagName('head')[0].appendChild(style);
It just creates a new style tag and inserts into the head.