JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <span>текст сообщения</span>
</div>

CSS

div {
    position: relative;
    width: 200px;
    /* height: 20px; */
    background: #333;
    color: #fff;
    padding: 1px 0;
    text-align: center;
}

div:after,
div:before {
    content: '';
    background: #333;
    top: 1px; bottom: 1px;
    width: 1px;
    
    position: absolute;
}

div:before {
    left: -1px;
}

div:after {
    right: -1px;
}

span {
    display: block;
    border: 10px solid #ff0;
}