JSFiddle - React, Tailwind, and code Playground
HTML
<div id="content">
<div id="fixed_header">
<a href="Javascript:" id="position">Click</a>
</div>
<p>Some content</p>
</div>
<div id="div1"></div>
CSS
#content {
height: 1000px;
position: relative;
padding-top: 100px;
}
#fixed_header {
height: 50px;
top: 10px;
left: 0;
background: red;
position: fixed;
width: 100%;
}
#div1 {
height: 50px;
left: 200px;
top: 0;
background: blue;
position: fixed;
width: 100px;
}
JavaScript
header = $("#fixed_header");
$("#position").click(function() {
$("#div1").position({
my: "top",
at: "bottom",
of: header
});
});