JSFiddle - React, Tailwind, and code Playground

by dima_k

HTML

<ul>
    <li><a href="#main">Show main page</a></li>
    <li><a href="#secondary">Show secondary page</a></li>
</ul>
<br/><br/>

<div id="main">
    <p>Hello, this is our main page!</p>
</div>

<div id="secondary">
    <p>We are on secondary page now!</p>
</div>

<div id="footer">My Footer</div>

CSS

div:not(#footer) {
    display: none;
}

div:target:not(#footer){
    display: block;
}

p {
    font-size: 2em;
    padding-bottom: 30px;
}