clipPath-html-07.xhtml

Enable keyboard shortcuts

<!DOCTYPE html>↩

<!--↩

     Any copyright is dedicated to the Public Domain.↩

     http://creativecommons.org/publicdomain/zero/1.0/↩

-->↩

<html xmlns="http://www.w3.org/1999/xhtml">↩

  <!-- From https://bugzilla.mozilla.org/show_bug.cgi?id=822014 -->↩

  <head>↩

    <title>Test clip-path on outer-&lt;svg&gt; with border</title>↩

    <style>↩

↩

html, body {↩

  border: 0; margin: 0;↩

}↩

↩

    </style>↩

  </head>↩

  <body>↩

    <svg xmlns="http://www.w3.org/2000/svg"↩

         width="200" height="200" clip-path="url(#cp)"↩

         style="border: solid 100px black; margin: 50px;">↩

↩

      <clipPath id="cp">↩

        <path d="M50,50 150,50 150,150 50,150 z"/>↩

      </clipPath>↩

↩

      <rect width="100%" height="100%" fill="yellow"/>↩

↩

    </svg>↩

  </body>↩

</html>↩