title: How can I setup an emulated device in Google Chrome to look like an A4 page?
body: <p>I have a website using Bootstrap 4. I am trying to modify the CSS so that I get it looking how I want when I print the page to a PDF.</p>
  
  <p>I have found the <code>Rendering</code> option to enable <code>Emulate CSS media type</code>. Enabling this means that the rules I see in the browser are the same ones that are applied during printing.</p>
  
  <p>I want to setup an <code>Emulated Device</code> in Chrome so that it has the same size as various physical pages such as A4.</p>
  
  <p>I am using a MacBook Pro 15" 2019 and so it should have a device pixel ratio of 2.</p>
  
  <p>An A4 page is 210mm x 297mm.</p>
  
  <p>What should the device width and height be set to?</p>