JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
<div class="nav-top-searchbar">
    <form>
        <span class="fa fa-search searchicon" aria-hidden="true"></span>
        <input type="text" name="search">
				<div style="">
					<img tabindex="1" src="https://s9.postimg.org/d6s4xvykv/Ellipsis.png" id="ellipsis">
					<div class="dropdown">
						 <li><a href="#">View Status</a><i class="fa fa-angle-down" aria-hidden="true"></i></li>
                <li><a href="#">Release Bills</a><i class="fa fa-angle-down" aria-hidden="true"></i></li>
                <li><a href="#">Add Attendee</a><i class="fa fa-angle-down" aria-hidden="true"></i></li>
                <li><a href="#">Export as</a><i class="fa fa-angle-down" aria-hidden="true"></i></li>
                <li><a href="#">View in Google Sheets</a><i class="fa fa-angle-down" aria-hidden="true"></i></li>
                <li><a href="#">Send Notifications</a><i class="fa fa-angle-down" aria-hidden="true"></i></li>
					</div>					
				</div>
        

    </form>
</div>


<div class="body-manage-attendees">
    <div class="container-fluid">

        <div class="row">
            <div class="col-4 col-sm-4 col-lg-4" style="background-color:white;">
                Name
            </div>
            <div class="col-3 col-sm-3 col-lg-3" style="background-color:white;">
                Number
            </div>
            <div class="col-3 col-sm-3 col-lg-3" style="background-color:white;">
                Table
            </div>
            <div class="col-2 col-sm-2 col-lg-2" style="background-color:white;">
                Bill
            </div>
        </div>

        <div class="row">
            <div class="col-4 col-sm-4 col-lg-4" style="background-color:white;">
                Amanda Doe
            </div>
            <div class="col-3 col-sm-3...

CSS

#ellipsis {
    top: 12px;
    position: absolute;
    right: 43px;
}
#ellipsis:focus {
	outline: none;
}
#ellipsis:focus + .dropdown {
	display: block;
}


input[type=text] {
    width: 100%;
    background: #10314c;
}

.dropdown {

    background-color: #FFFFFF;
    display: none;
    padding-left: 2%;
    position: absolute;
    height: 150px;
    right: 0;
    width: 200px;
    z-index: 10;
    list-style-type: none;
}

.searchicon {
    float: left;
    margin-top: -20px;
    position: relative;
    top: 28px;
    left: 8px;
    color: white;
     border: 1px solid #FFFFFF;
    z-index: 2;
    padding: 3px;
  
}

	.dropdown a 
	{
	    color: #676767;
	    font-weight: bold;
	    font-size: 14px;
	}
	
	.dropdown li:hover 
	{
	    background-color: #EDEDED;
	}