Custom Properties defined in :root are not supported in print

Issue #16025710 • Assigned to Bogdan B.

Details

Author
Erik W.
Created
Feb 20, 2018
Privacy
This issue is public.
Found in
  • Microsoft Edge
Found in build #
41.16299
Reports
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

In EdgeHtml 16, Custom properties defined in :root are not interpolated in the print dialogue. Additionally, any fallbacks are ignored.

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">

  <title>Test Edge</title>

  <style>
    :root {
      --test-color-a: orange;
    }
    html {
      --test-color-b: red;
    }

    .test-a {
      color: green;
      color: var(--test-color-a);
      border: 5px solid var(--test-color-a);
    }
    .test-b {
      color: green;
      color: var(--test-color-b);
      border: 5px solid var(--test-color-b);
    }
  </style>

</head>

<body>
  <div class="test-a">
    There should be an orange border around me.
  </div>
  <div class="test-b">
    There should be a red border around me.
  </div>
</body>
</html>

The above example will display correctly in the browser, but when printed, .test-a div will not have any text color or border.
Custom properties defined in html work as expected.

Attachments

1 attachment

Comments and activity

  • Microsoft Edge Team

    Changed Assigned To to “James M.”

    Changed Assigned To to “Bogdan B.”

You need to sign in to your Microsoft account to add a comment.

Sign in