JSFiddle - React, Tailwind, and code Playground

by Bryce Hayden

HTML

<div id="menu">
    <div class="child">
        <a href="/joomla31/">Somos</a>
    </div>
    <div class="child">
        <a href="/joomla31/index.php/segunda-pagina">Segunda Página</a>
    </div>
    <div class="child">
        <a href="#">Este es un texto largo para el menú</a>
    </div>    
</div>

CSS

#menu{
    width: 960px;
    height: 100px; 
    display: block;
}
.child{
    margin: 1%;
    background-color:#3d2f2f; 
    width: 30%;
    height: 100%;
    text-align: center;
    display: inline-block;
}
a
{
    background: #ffdb4c;
	position: relative;
	top: 50%;
	transform: 			translateY(-50%);
}