JSFiddle - React, Tailwind, and code Playground

HTML

<h3 tabindex="0">Navigation +</h3>
<nav tabindex="0">
<ul>
  <li><a href="#">Home</a></li>
  <li><h4 tabindex="0">Preise</h4>
	<ul>
	  <li><a href="#angebot">Angebot</a></li>
	  <li><a href="#info">Info</a>
	  <li><a href="#wo">Wo</a>
       </ul>
  </li>
  <li><h4>Galerie</h4>
	<ul>
	  <li><a href="#angebot">Deine Räume</a></li>
	  <li><a href="#info">Aussicht</a>
       </ul>
  </li>
</ul>
</nav>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<p id="angebot">Angebot</p>
<p id="info">info</p>
<p id="wo">wo</p>

CSS

* {
 margin:0;
 padding:0;
}
nav {
 position:relative;
}
nav  ul  {
 margin:0;
 padding:0;
 list-style:none;
 position:absolute;
 left:-99999em;
 top:-99999em;
 width:100%;
 background:#333;
}

nav ul ul {
 padding-left:10px;
 position:relative;
}
 
h3 {
 padding:10px;
 background:#a33;
 color:#fff;
 cursor:pointer;
}



h3:focus:before   {
 content:"Navigation -";
 display: block;
 position:absolute;
 top:0;
 left:0;
 right:0;
 background:#09c;
 color:#fff;
 cursor:pointer;
 padding: 10px;  
}

h3:focus ~ nav ul  , nav:active ul {
 left:auto;
 top:auto;
}

nav a , nav li {
 display:block;
 padding:5px;
 color:#fff;
 text-decoration:none;
}
nav a:hover {
 background:#a33;
}
nav a:active {
 background:#09c;
}


:target {
  color:#f00;
}