JSFiddle - React, Tailwind, and code Playground

by Shaiasiuk

HTML

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Цитата</title>
<link rel="stylesheet" href="css/quads.css" type="text/css">
 </head>
 <body>
 	  <p>content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content 
 	  </p>
 </body>
</html>

CSS

* {
	padding: 0;
	margin: 0;
}

body {
  margin:100px;
  height: 100px;
  float: left;
  width: 290px
}

p:before,  p:after{
	display: block;
	background: black;
	margin-top: 5px;
 	height: 90px;
 	width: 5px;
 	content: "";
 	float: left;
}

p:before{
		margin-left: -44px;
}
p:after {margin-right: -25px;	
	float: right;}

p {
	background-color: green;
	width: 290px;
	float: left;
	color: white;
	padding-left: 40px;
	padding-right: 20px;
	min-height: 100px;
}