border-image-fill-no-border-expected.html

<html>
<head>
  <style>
    .inline-block {
      display: inline-block;
      margin: 10px;
    }
    .fixed-container {
      height: 80px;
      width: 80px;
    }
    .square-background-two-layer {
        background-color: yellow;
        background-image: url('resources/svg-100x100-intrinsic.svg'), none;
        background-size: 100% 100%, auto;
    }
    .with-padding {
        background-size: 100% 100%, auto;
        background-clip: content-box, border-box;
        background-origin: content-box, padding-box;
        padding: 20px;
    }
    .green-bg {
        background-color: green;
    }
    .lime-border {
        border: 20px solid lime;
        background-color: green;
    }
  </style>
</head>
<body>
  <div class="inline-block fixed-container square-background-two-layer"></div>
  <div class="inline-block fixed-container square-background-two-layer with-padding"></div>
  <div class="inline-block fixed-container green-bg"></div>
  <div class="inline-block fixed-container green-bg lime-border"></div>
  <br>
  <div class="inline-block fixed-container square-background-two-layer"></div>
  <div class="inline-block fixed-container square-background-two-layer with-padding"></div>
  <div class="inline-block fixed-container green-bg"></div>
  <div class="inline-block fixed-container green-bg lime-border"></div>
  <br>
  <div class="inline-block fixed-container square-background-two-layer"></div>
  <div class="inline-block fixed-container square-background-two-layer with-padding"></div>
  <div class="inline-block fixed-container green-bg"></div>
  <div class="inline-block fixed-container green-bg lime-border"></div>
</body>
</html>
chromium/third_party/blink/web_tests/fast/borders/border-image-fill-no-border-expected.html
