sticky heading

Question

how can we create a heading which sticks on top
rules-
1 heading and 2 heading is there.
1 heading is in top and second is below the 1st one.
if we scroll the screen 1st heading goes along with the page but second heading sticks to the bottom

what is the code for it?

the answer in css or javascript

Answer 1

https://code.sololearn.com/Wbat8raAIZ2R/?ref=app

Answer 2

make the position of both the headings as fixed i.e.
position : fixed;
in your external or internal CSS.