JSFiddle - React, Tailwind, and code Playground

by arashgh

HTML

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>

<body>
	<div class="outer">
	<div class="inner">
	Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi voluptatibus iure aspernatur maiores tempora deserunt reiciendis aliquid quod distinctio debitis eius, nostrum obcaecati modi cum. Possimus, eos nobis explicabo corporis.
	Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi voluptatibus iure aspernatur maiores tempora deserunt reiciendis aliquid quod distinctio debitis eius, nostrum obcaecati modi cum. Possimus, eos nobis explicabo corporis.
		Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi voluptatibus iure aspernatur maiores tempora deserunt reiciendis aliquid quod distinctio debitis eius, nostrum obcaecati modi cum. Possimus, eos nobis explicabo corporis.
id quod distinctio debitis eius, nostrum obcaecati modi cum. Possimus, eos nobis explicabo corporis.
	Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi voluptatibus iure aspernatur maiores tempora deserunt reiciendis aliquid quod distinctio debitis eius, nostrum obcaecati modi cum. Possimus, eos nobis explicabo corporis.
	</div>
	</div>
</body>
</html>

CSS

html{
	  height:100%;
	}
  
 body{
		height: 100%;
		background-color: lightblue;
    margin:0;
	}
	
	.inner{
		height: 100%;
		background-color: blue;
	}

	.outer{
		width: 70%;
    min-height:100%;
    min-height:calc(100% - 80px);
		background-color: green;
		padding:40px;
	}