当 webkit 在 Chrome 和 Safari 中显示不同时发生了什么？ 当前浏览器版本的浏览器前缀是否已更改？

Question

Have any of the old prefixes been deprecated in the newer versions of the following browsers?

Chrome: -webkit- Internet Explorer: -ms- Safari: -webkit- Firefox: -moz-

We are attempting to remove PDF's but still want to provide an option for users to print a styled web page print document. I have been creating a print stylesheet for a stylized double sided sell sheet, and I have noticed that Safari and webkit do not treat @media print margins the same. Should they because they are both webkit?

The CSS I'm using works in all the browsers but Safari.

    @page {
  /*  size: A4 portrait; */
    margin:0;
    }
  @page :header { content: none ;} 
  @page :footer { content: none ;} 

  @media print {
  * {
    -webkit-print-color-adjust: exact !important;   /* Chrome, Safari */
    color-adjust: exact !important;                 /*Firefox*/
  }
  body {
    background-color:#FFFFFF; 
    border: solid px #000;
    margin: 2cm .508cm .508cm; /*.508cm;*/
    }

I suspect it's the way I have set up the margins, but I have it working well in Chrome, Explorer, and Firefox.

Safari errors: 1. header and footer page print information text shows in margin. 2. It prints 4 pages and it looks like the page size (letter portrait) is pushing past the page break.

What I did was adjust the size to reduce the runoff.

@page page-one page-two{
    /*margin: 0cm;*/
    width: 21.59cm; /* 8.5in */
    height: 25.94cm; /* = margin-top - 27.94cm; /* 11in */
    margin: 0cm;
    /* margin: 30mm 45mm 30mm 45mm;*/ 
    }
  .page-one {
    page-break-after: always;
    }

I feel I have made an error. Is there a logical way to set up a styled CSS page so it prints the same on all browsers?

Answer 1

AFAIK Chrome doesn't need -webkit- for certain features of CSS from a certain date. I don't know if this is one of these, but it would make sense if the issue was with the -webkit- line as only Safari still needs those tags.