Page crash when CSS clip-path uses Custom Properties

Issue #11975071


Dan W.
May 10, 2017
This issue is public.
Found in
  • Microsoft Edge
Found in build #
Reported by 2 people

Sign in to watch or report this issue.

Steps to reproduce

When a site’s CSS has a clip-path that uses a Custom Property such as:

div {
  --y: 0%;
  clip-path: polygon(0% 0%, 100% var(--y), 50% 100%);

The page won’t load and displays the message “This page is having a problem loading.”


Edge properly ignores clip-path (since it is not yet supported) when there are no variables. So clip-path: polygon(0% 0%, 100% 0%, 50% 100%) does not prevent the page from loading. It appears to only happen when a CSS Variable is introduced inside the clip-path value.


0 attachments

    Comments and activity

    • I first discovered this bug working on this art project: Single Div Accordion. I have since changed that to use @supports which kept it from crashing. But there are multiple other issues preventing it from rendering properly in Edge still, that I assume are related to: since it has a lot of variables inside pseudoelements.

    • Microsoft Edge Team

      Changed Assigned To to “James M.”

      Changed Assigned To to “Lee H.”

      Changed Assigned To to “Bogdan B.”

      Changed Status

    • This bug has marked as duplicate. Please follow the parent issue to get new updates.

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

    Sign in