I want to render a 1px border in between sibling nodes. I have constructed a solution using an SVG as a border-image that works in almost all modern browsers with this:
.svg-border {
border-style: solid;
border-width: 1px;
border-image-source: url("data:image/svg+xml...");
border-image-slice: 1 1;
border-image-outset: .5;
}
However, I’m stuck on Safari: it doesn’t appear to accept .5
as a value for border-image-offset
, so the borders appear as 2px width between adjacent siblings.
Does anyone know a workaround or other method to getting this to work?
Is it possible to render border-image-outset value of 0.5 in Safari?