JSFiddle - React, Tailwind, and code Playground

by deathstalkersid

HTML

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
  </head>

  <body>
    <div class="card">
      <div class="dropdown mb-3">
        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
          Dropdown button
        </button>
        <div class="dropdown-menu">
          <a class="dropdown-item" href="#">Link 1</a>
        </div>
      </div>
      <div class="dropdown mb-3">
        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
          Dropdown button
        </button>
        <div class="dropdown-menu">
          <a class="dropdown-item" href="#">Link 3</a>
        </div>
      </div>
      <div class="dropdown mb-3">
        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
          Dropdown button
        </button>
        <div class="dropdown-menu">
          <a class="dropdown-item" href="#">Link 1</a>
        </div>
      </div>
      <div class="dropdown mb-3">
        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
          Dropdown button
        </button>
        <div class="dropdown-menu">
          <a class="dropdown-item" href="#">Link 1</a>
        </div>
      </div>
    </div>
  </body>

</html>

CSS

.card {
  height: 150px;
  width: 30%;
  border: 2px solid black;
  margin: 100px 0px 0px 100px;
  overflow: auto;
}