JSFiddle - React, Tailwind, and code Playground

HTML

<div id="menu-wrapper">
	<ul id="hmenu">
    	<li><a href="#">Inicio</a></li>
        <li><a href="#">Personal</a>
        	<ul id="sub-menu">
            	<li><a href="#">Idiomas</a></li>
                <li><a href="#">Matematicas</a></li>
                <li><a href="#">Ciencias</a></li>
                <li><a href="#">Artes</a></li>
                <li><a href="#">Educacion Fisica</a></li>
            </ul>
        </li>
        <li><a href="#">Instalaciones</a>
        	<ul id="sub-menu">
            	<li><a href="#">Aulas</a></li>
                <li><a href="#">Direccion</a></li>
                <li><a href="#">Biblioteca</a></li>
                <li><a href="#">Area recreativa</a></li>
            </ul>
        </li>
        <li><a href="#">Contacto</a></li>   
        <li><a href="#">Actividades</a></li> 
    </ul>
</div>

CSS

body{margin:0;
	font-family: sans-serif;
	font-size:14px;
}

#menu-wrapper ul{padding:0;
	list-style:none;
}

#hmenu > li{
	display: inline-block;
}