JSFiddle - React, Tailwind, and code Playground
HTML
<div id="content">
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
<p>
Content! Woohoo!
</p>
</div>
<button id="bottom_button">
Test button
</button>
CSS
button {
position: fixed;
right: 16px;
bottom: 16px;
}
JavaScript
var contenth = $("#content").height();
var windowh = $(window).height();
if (contenth>windowh){
$("#bottom_button").css('right','24px');
}