JSFiddle - React, Tailwind, and code Playground

by wrafal

HTML

<link rel="stylesheet" href="maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">


<div class="container">
  <div class="row">
    <div class="column-md-3">
      <div class="input-group">
        <input type="text" class="form-control" placeholder="Select device" aria-describedby="basic-addon2">
        <span class="input-group-addon" id="basic-addon2">
          <button type=" button " class="btn btn-danger dropdown-toggle " data-toggle="dropdown " aria-haspopup="true " aria-expanded="false ">
            <span class="caret"></span>
        <span class="sr-only">Toggle Dropdown</span>
        </button>
        <ul class="dropdown-menu">
          <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>
        </span>
      </div>
    </div>
  </div>
</div>