JSFiddle - React, Tailwind, and code Playground

Paragraph Borders - Info type boxes

by Jennifer Perrin

HTML

<div id="box-text">
    <p><span class="bold">Lorem ipsum</span> dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Euismod tincidunt ut laoreet dolore magna aliquam.</p>
</div>

CSS

body { margin:20px; }

#box-text{
    background: #38668f;
    border: 5px solid #4376a1;
    float: left;
}

#box-text p{
    border-bottom: 2px solid #4376a1;
    border-top: 2px solid #4376a1;
    color: #fff;
    float: left;
    line-height: 1.25em;
    margin: 10px 30px;
    text-shadow: 0 1px 1px hsla(0,0%,100%,.25);
}
span.bold {
    font-weight: bold;
}