JSFiddle - React, Tailwind, and code Playground
by 규연 황
HTML
<div class="main">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Delectus sapiente distinctio id esse, nobis exercitationem dolore maiores velit unde vitae eveniet cum, eos dolores. Facilis eligendi veniam eum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing...
CSS
* {
padding: 0;
margin: 0;
font-size: 20px;
}
html, body {
min-height: 100%;
}
.main {
position: relative;
z-index: 1;
background: #FFFFFF;
/* min-height: 100vh; */
}
.footer {
position: sticky;
/* top: 0; */
right: 0;
bottom: 0;
left: 0;
width: 100%;
background: #999999;
padding: 80px;
}
p {
margin: 0;
}