JSFiddle - React, Tailwind, and code Playground

by rohanbhangui

HTML

<header>Header</header>
<div class="content">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit esse aliquam illum doloremque accusamus fuga id odio laborum cum unde quo neque quas. Error deserunt aspernatur numquam ratione nostrum amet.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit esse aliquam illum doloremque accusamus fuga id odio laborum cum unde quo neque quas. Error deserunt aspernatur numquam ratione nostrum amet.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit esse aliquam illum doloremque accusamus fuga id odio laborum cum unde quo neque quas. Error deserunt aspernatur numquam ratione nostrum amet.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit esse aliquam illum doloremque accusamus fuga id odio laborum cum unde quo neque quas. Error deserunt aspernatur numquam ratione nostrum amet.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit esse aliquam illum doloremque accusamus fuga id odio laborum cum unde quo neque quas. Error deserunt aspernatur numquam ratione nostrum amet.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odit esse aliquam illum doloremque accusamus fuga id odio laborum cum unde quo neque quas. Error deserunt aspernatur numquam ratione nostrum amet.
    <footer>Footer</footer>
</div>

CSS

* {
  margin: 0px;
  padding: 0px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #484848;
  -webkit-text-stroke: 0.35px;
  -webkit-font-smoothing: antialiased;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

html, body {
  min-height: 100vh;
  width: 100%; }

header, footer {
    height: 40px;
    text-align: center;
    color: #eaeaea;
    background: red;
    vertical-align: middle;
    padding-top: 10px;
}


.content {
    min-height: 100%;

}

footer {
    background: green;
}