Having problem with my navbar ...

*Expected behavior*The text : Here on rightis suposed to be on the right end of the navbar ...

*Actual behavior*The text: here on rightis after the nav links and not on the right end of it.

Resources (screenshots, code snippets etc.)

  <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
    <div class="container">
      <a class="navbar-brand" href="#"><img src="img/logo-dark.png" height="40" alt="Fox" loading="lazy"/></a>
      <button class="navbar-toggler" type="button" data-mdb-toggle="collapse" data-mdb-target="#navbarExample01" aria-controls="navbarExample01" aria-expanded="false" aria-label="Toggle navigation" >
        <i class="fas fa-bars"></i>
      </button>
      <div class="collapse navbar-collapse" id="navbarExample01">
        <ul class="navbar-nav me-auto mb-2 mb-lg-0">
          <li class="nav-item active">
            <a class="nav-link linknav" aria-current="page" href="#">Home</a>
          </li>
          <li class="nav-item">
            <a class="nav-link linknav" href="#">Products</a>
          </li>
          <li class="nav-item">
            <a class="nav-link linknav" href="#">Contact</a>
          </li>
          <li class="nav-item">
            <a class="nav-link linknav" href="#">
              <i class="fas fa-shopping-cart"></i>
              <span class="badge rounded-pill badge-notification bg-danger">1</span>
            </a>
          </li>
        </ul>
        <span class="float-end">here on right</span>
      </div>
    </div>
  </nav>