JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
<ul>
    <li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Some Dropdown<b class="caret"></b></a>
        <ul class="dropdown-menu">
            <li><i class="icon-arrow-up"></i><a href="#">Up</a></li>
            <li><i class="icon-arrow-down"></i><a href="#">Down</a></li>
            <li><i class="icon-arrow-left"></i><a href="#">Left</a></li>
            <li><i class="icon-arrow-right"></i><a href="#">Right</a></li>
        </ul>
    </li>
</ul>

CSS

.dropdown-menu a {
    white-space:normal;
}