JSFiddle - React, Tailwind, and code Playground

by Skaiman

HTML

<div class="box one">
	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam et.
	<hr/>
	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam et fermentum dui. Ut orci quam.
</div>
<div class="box two">
	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam et.
	<hr/>
	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam et fermentum dui. Ut orci quam.
</div>

CSS

.box {
	width: 100%;
	height: 50px;
	padding: 10px;
	margin: 10px 0;
}

.one {
	background: #EEEEEE;
}

.two {
	background: #424242;
	color: #fff;
}

hr {
border: 0;
height: 1px;
background: linear-gradient(to left, transparent 0%, #F44336 50%, #F44336 85%, transparent 100%);
}