| <!DOCTYPE html> |
| <meta charset="utf-8"> |
| <link rel="author" title="Tyler Wilcock" href="mailto:twilco.o@protonmail.com"> |
| <link rel="help" href="https://www.w3.org/TR/2017/CR-css-backgrounds-3-20171017/#border-images"> |
| <link rel="match" href="border-image-displayed-with-transparent-border-color-ref.html"> |
| <title> |
| border-color: transparent should not hide the border-image |
| </title> |
| <style> |
| div { |
| width: 200px; |
| height: 200px; |
| margin: 20px; |
| background-color: silver; |
| border-image-source: url('./support/100x100-blue-and-orange.png'); |
| border-image-slice: 32; |
| border-image-repeat: repeat; |
| border-style: solid; |
| border-width: 32px; |
| } |
| </style> |
| |
| This box should have a visible blue-orange border-image. |
| <div style="border-color: transparent;"></div> |
| |