JSFiddle - React, Tailwind, and code Playground

by andypotanin

HTML

<header data-template="header">
    <section>header content</section>
</header>

<!-- whatever is rendered by header.php should end here -->

<div class="is-home main-wrapper" data-template="home">
    <article data-id="3243">post content for ID #3243</article>
    <aside>aside content</aside>
</div>

<!-- the above element is NOT wrapped by any element that starts in header and ends in footer, as often done in themes -->

<footer data-template="footer">
    <section>footer content</section>
</footer>

CSS

header, footer, div.main-wrapper {
    background-color: red;
    margin: 1em;
    padding: 1em;
}