Trying to use css to solve a longstanding Chrome browser issue of briefly displaying page orientation options when printing then hiding it

Question

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);

Answer 1

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.