JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu-container">
    <div class="navigation-menu">
        <div class="navigation-menu-title-item">
            <a class="navLink" href="index.html">Home</a>
        </div>
    </div>
    <div class="navigation-menu">
        <div class="navigation-menu-title-item">
            <a class="navLink" href="games.html">Animals</a>
        </div>
        <div class="navigation-menu-item">
            <a class="navLink" href="lion.html">Lion</a>
        </div>
        <div class="navigation-menu-item">
            <a class="navLink" href="tiger.html">Tiger</a>
        </div>
    </div>
    <div class="navigation-menu">
        <div class="navigation-menu-title-item">
            <a class="navLink" href="about.html">About</a>
        </div>
    </div>
</div>
<div class="video-container">
<div class="lyte" id="gnDh6PqWqD8" style="width:480;height:385;"><noscript><a href="http://youtu.be/gnDh6PqWqD8">Watch on YouTube</a></noscript>
    <script>(function(){d=document;if(!document.getElementById('lytescr')){lyte=d.createElement('script');lyte.async=true;lyte.id="lytescr";lyte.src="http://futtta.be/lyte/lyte.js";d.getElementsByTagName('head')[0].appendChild(lyte)}})();</script></div>
</div>

CSS

.menu-container {
    position: absolute;
    left:250px;
}

.video-container{
    position: absolute;
    top: 25px;
    z-index:-1;
}

.navigation-menu-title-item {
  
    background-color:red;
  
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.navigation-menu-item
{
    background-color:red;
}

.navigation-menu {
  float:left;
  text-align: center;
}