JSFiddle - React, Tailwind, and code Playground

HTML

<div class="header"> HEADER </div> 
<div class="footer"> FOOTER </div>
<div>
This is a normal text output . 
</div>

CSS

div.header {position: running(header)}
div.footer {position: running(footer)} 
@page{
         @top-center {content: element(header)}
         @bottom-center {content: element(footer)}
     }