Custom Properties defined in :root are not supported in print

Issue #16025710 • Assigned to Bogdan B.


Erik W.
Feb 20, 2018
This issue is public.
Found in
  • Microsoft Edge
Found in build #
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">
  <meta charset="utf-8">

  <title>Test Edge</title>

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


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

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.


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