JSFiddle - React, Tailwind, and code Playground

by Pradeep Kumar

HTML

<ul class="nav nav-pills" role="tablist">
  <li role="presentation">Order: </li>
  <li role="presentation" class="dropdown">
    <a href="#" class="dropdown-toggle" id="drop4" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                            Ticker
                                <span class="caret"></span>
                            </a>
    <ul class="dropdown-menu" id="menu1" aria-labelledby="drop4">
      <li>
        <a href="#">Action</a>
      </li>
      <li>
        <a href="#">Another action</a>
      </li>
      <li>
        <a href="#">Something else here</a>
      </li>
      <li role="separator" class="divider"></li>
      <li>
        <a href="#">Separated link</a>
      </li>
    </ul>
  </li>

CSS

.nav-pills{
  display:flex;
  align-items:center;
}