JSFiddle - React, Tailwind, and code Playground

by Harm Zeinstra

HTML

<div class="content">
m ipsum dolor sit amet, consectetur adipiscing elit. Praesent faucibus eros sit amet eleifend aliquet. Praesent rhoncus aliquet turpis, at tempor magna ornare a. Pellentesque at metus eu justo eleifend dignissim. Fusce placerat sapien ut gravida interdum. Aenean a fermentum dolor. Nulla tempus efficitur urna ac fermentum. Fusce et rutrum nunc, et congue risus. Maecenas feugiat ut eros ac varius.

Curabitur rhoncus fermentum mi vel pulvinar. Mauris consequat massa ac velit dapibus, in porttitor eros congue. Etiam feugiat, eros vel tempor gravida, felis nunc vehicula enim, vitae posuere enim elit ac arcu. Donec nec mi nibh. Fusce venenatis odio vitae mi ornare malesuada. In maximus lectus id ligula iaculis, vel pellentesque lacus cursus. Mauris rutrum gravida nunc, condimentum mollis velit accumsan vel. Integer condimentum vulputate ex, in pharetra purus lobortis quis. Aliquam eget sagittis ex. Donec sit amet lorem eu nisl pellentesque elementum. Nulla ultricies luctus consequat. Quisque aliquet, purus dapibus finibus fermentum, dui eros gravida ex, id mollis arcu ipsum non urna. Nam scelerisque tincidunt condimentum.

Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec aliquam, nisl sed pharetra faucibus, mi massa finibus nulla, in vestibulum elit sapien vel felis. Proin odio urna, gravida dignissim ex id, congue mollis nisi. Proin viverra pulvinar velit a pretium. Morbi mollis massa sed accumsan elementum. Etiam pretium porta ullamcorper. Praesent lobortis neque massa, ut pulvinar justo feugiat vel. Donec pellentesque molestie commodo. Nunc augue sem, vestibulum eu porttitor id, rutrum vitae lectus. Etiam blandit cursus augue.

Nunc vel velit pulvinar, tempus sem ac, pulvinar sapien. Phasellus mi sem, ultricies vel dictum vitae, porta in ex. Cras sit amet ornare turpis, sed feugiat justo. Proin malesuada consectetur ex non lobortis. Ut in lacus ut turpis placerat mattis. Sed non pharetra felis. Duis...

CSS

.content{
height:100%;
width:100%;
background-color:white;
}

.footer{
linear-gradient(to bottom, white 0%, #010101) 8%,DeepSkyBlue 100%);
height:100px;
width:100%;
background-color:DeepSkyBlue;
}

.ghost{
height:50px;
width:100%;
background-color:white;
}