[image][1]
[1]: https://i.stack.imgur.com/eve4B.png

the problem is generally due to margin-top to align the in chrome.edge it will get aligned with mt-9 on firefox its precisely mt-9/36px above from getting aligned

i additionally notcied the first aspect of drop down menu is completely aligned with the opposite two nav checklist in firefox

Similar problem occurs for me in tailwind playgroud
https://play.tailwindcss.com/gJBz2spKSm

  <hyperlink href="{{ asset('css/normalize.css') }}" rel="stylesheet">
    <hyperlink href="{{ asset('css/app.css') }}" rel="stylesheet">
    <hyperlink href="{{ asset('css/kinds.css') }}" rel="stylesheet">
    <script src="https://cdn.jsdelivr.internet/npm/tw-elements/dist/js/index.min.js"></script>


<div class="nav bg-white">
  <nav class="py-1 md:py-4 mx-0">
    <div class="container px-4  mt-2 md:flex ml-auto max-w-full" >
      <div class="flex items-center justify-between">
        <div class="flex items-center">
          <a href="/" ><img class="nav--image" src="" alt=""></a>
          <a href="/"><img class="nav--image-text px-4 py-2" src="" alt=""></a>
        </div>
        <button class="font-bold border border-solid border-gray-600 px-4 py-2 rounded text-indigo-600 hover:opacity-95 md:hidden" id="navbar-toggle">
          <i>MENU</i>
        </button>
      </div>
      <div class="nav--list hidden md:flex flex-col  md:flex-row ml-auto" id="navbar-collapse">
        <div class="hidden md:flex">
          <div class="dropdown relative">
              <a
                class="font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mx-2 text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300  md:ml-auto mt-9"
                href="#" sort="button" id="dropdownMenuButton2" data-bs-toggle="dropdown" aria-expanded="false"
              >HELP</a>
              <ul
                class="
                  dropdown-menu
                  min-w-max
                  absolute
                  bg-white
                  text-base
                  z-50
                  float-left
                  py-2
                  list-none
                  text-left
                  rounded-lg
                  shadow-lg
                  mt-1
                  hidden
                  m-0
                  bg-clip-padding
                  border-none
                "
                aria-labelledby="dropdownMenuButton2"
              >
                <li class="mb-4"> 
                  <a href="" class="font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mx-2 text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300 mt-2 md:mt-9 md:ml-auto  py-2
                  px-4">FIND</a>
                  </li>
                  <li class="mb-4">
                  <a
                    class="font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mx-2 text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300 mt-2 md:mt-9 md:ml-auto
                    py-2
                    px-4"
                    href=""
                    >HOME</a
                  >
                </li>
                <li class="mb-4">
                  <a
                    class="font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mx-2 text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300 mt-2 md:mt-9 md:ml-auto
                    py-2
                    px-4"
                    href=""
                    >FIND</a>
                </li>
              </ul>
            </div>
          </div>
        <a href="" class="md:hidden font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mx-2 text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300 mt-2 md:mt-9 md:ml-auto">FIND</a>
        <a category="md:hidden font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mx-2 text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300 mt-2 md:mt-9 md:ml-auto" href="">HOME</a>
        <a category="md:hidden font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mx-2 text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300 mt-2 md:mt-9 md:ml-auto" href="">FIND</a>
        <a href="" class="font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mx-2 text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300 mt-2 md:mt-9 md:ml-auto">REGISTER</a>
        <a href="" class="font-bold md:text-xl text-base p-2 lg:px-4 md:mb-5 md:mr-0  text-indigo-600 text-right  border-solid border-indigo-600 rounded hover:bg-indigo-600 hover:text-white transition-colors duration-300 mt-2 md:mt-9 md:ml-auto">LOGIN</a>
    </div>
  </nav>
<script>
            let toggleBtn = doc.querySelector("#navbar-toggle");
        let collapse = doc.querySelector("#navbar-collapse");

        toggleBtn.onclick = () => {
        collapse.classList.toggle("hidden");
        collapse.classList.toggle("flex");
        };
</script>
</div>