JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
88<br>
v
  <footer></footer>
</div>

CSS

* {
  margin: 0;
  padding: 0;
}
body {
  height: 100vh;
  width: 100%;
}
.wrapper {
  position: relative;
  max-width: 300px;
  height: 100%;
  margin: auto;
  background: grey;
}

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100px;
  background: red;
}