JSFiddle - React, Tailwind, and code Playground

by brigand

HTML

<div class="box a">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab, blanditiis harum, laudantium reprehenderit itaque officia, voluptatibus nulla quas modi aliquid quidem explicabo expedita. Consequatur rerum velit, blanditiis quam, porro alias.</div>
<div class="box b">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab, blanditiis harum, laudantium reprehenderit itaque officia, voluptatibus nulla quas modi aliquid quidem explicabo expedita. Consequatur rerum velit, blanditiis quam, porro alias.</div>

CSS

body {
  display: flex;
  perspective: 1000px;
  transform-style: preserve-3d;
}

.box {
  width: 20em;
  box-shadow: inset 0 0 0 3px black;
  padding: 1em;
  box-sizing: border-box;
}

.box.a {
  transform: rotateY(-45deg);
}