JSFiddle - React, Tailwind, and code Playground

by caiocafardo

HTML

<div class="frente_fundo">
<div class="frente_caixa">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc in mi consequat eros pharetra hendrerit. Suspendisse potenti. Nulla ut massa nisl. Nam eros leo, sollicitudin eget fringilla in, fermentum auctor arcu. Praesent aliquam, lorem blandit commodo consectetur, mauris elit interdum ipsum, at faucibus sapien enim sit amet est. Quisque erat sapien, rhoncus non hendrerit eget, fringilla eu tellus. Proin cursus suscipit eros non euismod.

Duis commodo accumsan ipsum et rhoncus. Etiam gravida nulla tempor neque pulvinar tincidunt. Mauris ornare, elit in bibendum faucibus, lacus neque gravida ante, scelerisque porttitor diam felis a massa. Curabitur nec dapibus enim, et convallis enim. Sed venenatis nisl eget varius tristique. Nam ultricies nisi non nisi luctus elementum. Vivamus pretium purus sit amet eleifend ultrices. Nulla facilisi. Vestibulum elementum orci sit amet enim congue, a ultricies lectus sagittis. Nulla rhoncus massa sed posuere tempor. Etiam tempus, libero et molestie finibus, nunc felis tristique lorem, vel semper ex nulla sed lorem. Curabitur at commodo tellus.

Vivamus elit nisl, malesuada non nulla non, ullamcorper aliquam urna. Sed eu facilisis lorem, et sollicitudin nisi. Integer tempus sed dui at feugiat. Vivamus augue lorem, aliquet nec luctus eu, efficitur sed elit. Fusce aliquet sodales tristique. Duis tempor mollis nulla vitae pulvinar. Sed id odio leo. Maecenas vitae rutrum sem. Proin malesuada sit amet nibh sit amet sagittis. Donec tristique est id efficitur ullamcorper. Suspendisse rutrum, ex eu tincidunt volutpat, lorem dolor venenatis mi, eleifend pulvinar arcu lectus vel ipsum.

Curabitur nec consectetur dolor. Nullam sed dolor pellentesque, fermentum nisi non, hendrerit turpis. Donec augue elit, pharetra viverra eros id, euismod lobortis elit. Proin vel risus placerat, rutrum nisl vitae, rutrum ipsum. Nam at pharetra nisl, quis consequat risus. Vivamus rutrum nec purus vel...

CSS

.site{
  width: 100%;
  max-width: 500px;
  height: auto;
  color: #000000;
}
.frente_fundo{
  width: 100%;
  height: 100%;
  color: #823007;
  position: fixed;
  background-color: rgba(250, 250, 250, 0.85);
  overflow-y: scoll
}
.frente_caixa{
   width: 100%;
  max-width: 500px;
  height: auto;
  	display: block;
	margin-left: auto;
	margin-right: auto;
}