JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://yui.yahooapis.com/3.14.1/build/yui/yui-min.js"></script>
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.4.1/pure-min.css">
<div id="demo-horizontal-menu">
    <ul id="std-menu-items">
        <li><a href="#" id="messenger">Messenger</a></li>
        <li>
            <a href="#">Mydropdown</a>
            <ul>
                <li class="pure-menu-separator"></li>
                <li><a href="#" id="drop_autos">Autos</a></li>
                <li><a href="#" id="drop_flickr">Flickr</a></li>
                <li><a href="#" id="drop_answers">Answers</a></li>
            </ul>
        </li>
    </ul>
</div>

JavaScript

YUI({
    classNamePrefix: 'pure'
}).use('gallery-sm-menu', function (Y) {

    var horizontalMenu = new Y.Menu({
        container         : '#demo-horizontal-menu',
        sourceNode        : '#std-menu-items',
        orientation       : 'horizontal',
        hideOnOutsideClick: false,
        hideOnClick       : false
    });

    horizontalMenu.render();
    horizontalMenu.show();

});