JSFiddle - React, Tailwind, and code Playground

HTML

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<nav class="navbar navbar-expand-md bg-dark navbar-dark">
  <div class="container">
    <a class="navbar-brand" href="#"><img src="https://i.imgur.com/E1r683u.png" class="img-fluid"></a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
    <span class="navbar-toggler-icon"></span>
  </button>
    <div class="collapse navbar-collapse justify-content-end" id="collapsibleNavbar">
      <ul class="navbar-nav">

        <li class="nav-item">
          <a class="nav-link" href="#">Contact</a>
        </li>
      </ul>
    </div>
  </div>
</nav>

CSS

.navbar {
  background-color: #fff;
  padding: 0px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.54), 0 2px 10px 0 rgb(175, 175, 175);
}

.navbar-toggler {
  background-color: #2196f3;
  margin-right: 10px;
}

.dropdown-item:hover {
  color: #fff;
  text-decoration: none;
  background-color: #2196f3 !important;
}

/* media queries */

.container{
  flex-wrap:nowrap !important;
}