clip-path-circle-003.html | Explore in Territory

<!DOCTYPE html>
<html>
<head>
    <title>CSS Masking: Test clip-path property and circle function with percentage radius</title>
    <link rel="author" title="Dirk Schulze" href="mailto:[email protected]">
    <link rel="help" href="http://www.w3.org/TR/css-masking-1/#clipping-paths">
    <link rel="help" href="http://www.w3.org/TR/css-masking-1/#the-clip-path">
    <link rel="match" href="reference/clip-path-circle-ref.html">
    <meta name="fuzzy" content="0-38; 0-800">
    <meta name="assert" content="The clip-path property takes the basic shape
    'circle' for clipping. Test percentage value as argument for radius and no
    position arguments. The circle should be in the center of the element. On
    pass there should be a green circle.">
</head>
<body>
    <p>The test passes if there is a full green circle.</p>
    <div style="width: 200px; height: 200px; background-color: green; clip-path: circle(50%);"></div>
</body>
</html>

chromium/third_party/blink/web_tests/external/wpt/css/css-masking/clip-path/clip-path-circle-003.html