JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="container">
<div class="row">
<div class="col-sm-9">
<div class="dropdown">
<a class="btn dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">Some title</a>
<div class="dropdown-menu dropdown-menu-right subscribe-box" aria-labelledby="dropdownMenu1">
<ul class="nav nav-pills" id="myTab">
<li class="active"><a href="#" data-target="#mail" data-toggle="tab"><i class="fa fa-envelope-o"></i></a></li>
<li><a href="#" data-target="#twitter" data-toggle="tab"><i class="fa fa-twitter"></i></a></li>
<li><a href="#" data-target="#sms" data-toggle="tab"><i class="fa fa-commenting"></i></a></li>
<li><a href="#" data-target="#rss" data-toggle="tab"><i class="fa fa-rss"></i></a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="mail">
<p>Enter your email address.</p>
<div class="row">
<div class="col-sm-8 input-box">
<input placeholder="[email protected]" type="text">
</div>
<div class="col-sm-4 input-button">
<a href="" class="btn">Subscribe</a>
</div>
</div>
</div>
<div class="tab-pane" id="twitter">
<p>Enter your twitter username</p>
<input placeholder="@username" type="text">
</div>
<div class="tab-pane" id="sms">
<p>phone</p>
<input placeholder="555-123-4567" type="text">
</div>
<div class="tab-pane" id="rss">
...