Blitz - WPT: corner-shape-img-border.html

wpt / css / css-borders / corner-shape / corner-shape-img-border.html

/css/css-borders/corner-shape/corner-shape-img-border.html

<!DOCTYPE html>
<link rel="match" href="corner-shape-img-border-ref.html">
<link rel="help" href="https://drafts.csswg.org/css-borders-4/#corner-shape">
<meta name="fuzzy" content="maxDifference=0-92;totalPixels=0-255">
<style>
img {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  corner-shape: bevel scoop notch square;
  box-sizing: border-box;
  border: 20px solid blue;
  object-fit: cover;
}
</style>
<img src="/images/green.png" width="200" height="200">

/css/css-borders/corner-shape/corner-shape-img-border-ref.html

<!DOCTYPE html>
<style>
div {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  corner-shape: bevel scoop notch square;
  box-sizing: border-box;
  border: 20px solid blue;
  background: url(/images/green.png);
}
</style>
<div></div>