Set custom page size in chrome preview dialog for print

Question

i'm going to be as clearly as possible. I have a svg code (inside a div) that consist on an image and a text. I need that svg code to has special width and height; in particular, i need them to be 190 x 250 mm. I already set this, by assigning 925px to width (since i use an online conversor from mm to px) and 700px to height.

The problem is, that when i open the file on Chrome and proceed to print (Cmd + P), print dialog open, and it shows me that my design is going to be printed on a A4 page. I have a custom paper (in real life, physically) that has the dimensions previously commented, so thats why i need that, when i open the print dialog (cmd + p), the 190x250mm paper appears (and not the A4 which "adds" that blank space)

I have a Mac, and after the print dialog open, i'm able to click on something like "show more options", and then setting the paper size that i actually want. However, when i print with this, my design does not cover the 100% of the paper.

What i've already tried was, using jspdf library, convert my svg to a pdf with the exact dimensions that i want. This works, only if a use common fonts (arial, times new roman, etc) on the svg, but no if i use special fonts.

I really, really, appreciate some help here. Thank you so much, and sorry for my English. Hope you understand !

This is my svg design - simplified

This is what happen (and what i don't want to

EDIT: This is what i want in order to be able to print (notice how the print preview "fits" to the custom paper size). (The image is edited of course)

What i need

user_7897395 · Answer

I needed to add a negative margin to the @page in order to remove the white border. But printers may decide they want that margin.

*{
  margin:0;
  padding:0;
}
svg{max-width:100vh;}

@media print{
  @page{
    margin:-1em;
    padding:0;
    width:100%;
  }
  svg {
       margin:0;
       width:100%;
    }
}

Set custom page size in chrome preview dialog for print

1 Answers