JSFiddle - React, Tailwind, and code Playground

HTML

<p class="first"><span>'border-color: inherit' works</span></p>
<p class="second"><span>'border-width: inherit' does not work</span></p>

CSS

.first, .second {
    border-color: red;
    border-width: 5px;
    background: #eee;
    border-style: solid none;
}

.first span {
    border-width: 2px;
    border-color: inherit;
    border-style: solid;
}

.second span {
    border-width: inherit;
    border-color: green;
    border-style: solid;
}