JSFiddle - React, Tailwind, and code Playground

by bryiantan

HTML

<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
  <a class="navbar-brand" href="#">Grass World Sport News</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" id="collapsibleNavbar">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link" href="#">Home</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">World Cup</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Sports</a>
      </li>    
       <li class="nav-item">
        <a class="nav-link" href="#">Schedule</a>
      </li>   
       <li class="nav-item">
        <a class="nav-link" href="#">About</a>
      </li>   
    </ul>
  </div>  
</nav>
  <img src="https://images.pexels.com/photos/255379/pexels-photo-255379.jpeg?auto=compress&cs=tinysrgb&h=100" height="100px" class="max-width w-100"/>