JSFiddle - React, Tailwind, and code Playground

by lbstr

HTML

<div class="wrap">
    <div class="fll bracket bracket-left"></div>
    <div class="fll content">
        <p>Content here</p>
        <p>Content here</p>
        <p>Content here</p>
    </div>
    <div class="fll bracket bracket-right"></div>
    <div class="clear"></div>
</div>

CSS

.fll { float: left; }
.clear { clear: both; }

.wrap { height: 200px; }

.bracket { 
    width: 15px;
    border: 3px solid #000;
    height: 100%;
}

.bracket-left {
    border-right: none;
}

.bracket-right {
    border-left: none;
}

.content {
    margin: 0 10px;
    font-size: 28px;
}