JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <ul class="level-one">
        <li> <a href="#">Home</a> </li>
        <li> <a href="#">Drops</a>
            <ul class="level-two">
                <li> <a href="#">One</a> </li>
                <li> <a href="#">Two</a> </li>
                <li> <a href="#">Three</a> </li>
            </ul>
        </li>
        <li> <a href="#">Contact</a> </li>
    </ul>
</div>

<div id="container">
    <div id="row">
        <div id="left">
            <h4>Left Col</h4>
            <p>...</p>
        </div>
        <div id="middle">
            <h4>Middle Col</h4>
            <p>...</p>
        </div>
        <div id="right">
            <h4>Right Col</h4>
            <p>...</p>
        </div>
    </div>
</div>

CSS

.level-one {
    /* trigger block formatting context to contain floats. */
    overflow: hidden; 
}

/* because of the * default code it takes out all margin and padding */
* {
    margin: 0px;
    padding: 0px;
}
#container {
    display: table;
}
#row {
    display: table-row;
}
#left, #right, #middle {
    display: table-cell;
}
#row {
    display: table-row;
}
#left, #right, #middle {
    display: table-cell;
}
body {
    font-family: verdana;
    font-size: 10px;
    background-color: ABC;
    padding: 50px;
    margin: auto;
}
h1 {
    text-align: center;
}
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
li {
    float: left;
    position: relative;
}
li + li {
    border-left: 1px solid #ccc;
}
a {
    display: block;
    padding: 7px 10px;
    color: #222;  /*changes the color of all item font color in menu bar */
    background: #eee; /*changes the background color of Menu bar */
    text-decoration: none;
}
a:hover {
    color: #fff;
    background: #666; /* changes hover bg color of any menu item being pointed*/
}
a:active {
    color: #f2f75e;
    background: #0090cf;
}
/* Child Menu Styles */
.level-two {
    position: absolute;
    top: 100%;
    left: -9999px;
    width: 100px;
}
li:hover .level-two {
    left: 0;
}
.level-two li {
    width: 100%;
    border: 0;
    border-top: 1px solid #ccc;
}