JSFiddle - React, Tailwind, and code Playground

by Rodwyn Moreno

HTML

<p>Hola Javi</p>

<div>
  <div class="x"></div>
  <div>contendio</div>
  <div class="y"></div>
</div>

CSS

p {
  background: yellow;
  position: relative;
}

p::after {
  position: absolute;
  background: green;
  width: 2px;
  height: 100%;
  bottom: 0;
  left: 0;
  content: "";
}

p::before {
  position: absolute;
  background: red;
  width: 2px;
  height: 100%;
  top: 0;
  right: 0;
  content: "";
}