JSFiddle - React, Tailwind, and code Playground

HTML

<div class="frame">
    <p>
        Lorem ipsum dolor...
    </p>   
    <p>
        Mauris bibendum mauris non
    </p>
</div>

CSS

.frame {
    position:relative;
    padding:5px;
}
.frame:before {
    height:10px;
    position:absolute;
    top:0px;
    left:0px;
    right:0px;
    border-left:1px solid black;
    border-right:1px solid black;
    content: " ";
}
.frame:after {
    height:10px;
    position:absolute;
    bottom:0px;
    left:0px;
    right:0px;
    border-left:1px solid black;
    border-right:1px solid black;
    content: " ";
}
.frame > p {
    text-align:justify;
    margin:0;
    padding:0;
}
.frame :first-child:before {
    position:absolute;
    top:0px;
    bottom:0px;
    left:0px;
    width:10px;
    border-top:1px solid black;
    border-bottom:1px solid black;
    content: " ";
}

.frame :first-child:after {
    position:absolute;
    top:0px;
    bottom:0px;
    right:0px;
    width:10px;
    border-top:1px solid black;
    border-bottom:1px solid black;
    content: " ";
}