Как я могу поместить поиск по в конце? django, bootstrap5

Я делаю простой сайт, используя django и bootstrap5. Я пробовал использовать class="de-flex justify-content-end", чтобы поместить поиск в конце. но это не работает

вот как это выглядит:

enter image description here

Вот код:

  <body>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
      <div class="container">
        <a class="navbar-brand" href="{% url 'my_websites:home' %}">
        my website </a>
        <button class="navbar-toggler" type="button"
            data-bs-toggle="collapse" data-bs-target="#navbarNav"
            aria-controls="navbarNav" aria-expanded="false"
            aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>

    <div class="collapse navbar-collapse" id="navbarNav">
      <ul class="navbar-nav">
        <li class="nav-item">
          <a class="nav-link" href="{% url 'my_websites:about_me' %}">
            About Me </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="{%url 'my_websites:blog' %}"> Blog </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="{% url 'my_websites:contact' %}"> Contact </a>
        </li>
        <li class="nav-item dropdown">
          <a class="nav-link dropdown-toggle" href="#"
           id="navbarDropdownMenuLink" role="button"
           data-bs-toggle="dropdown" aria-expanded="false"> More
          </a>
          <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
            <li><a class="dropdown-item" href="#">Join our club!</a></li>
            <li><a class="dropdown-item" href="#">Membership</a></li>
            <li><a class="dropdown-item" href="#">Be Ullie's friends!</a></li>
          </ul>
      </ul>
      <form class="d-flex justify-content-end">
        <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
        <button class="btn btn-outline-success" type="submit">Search</button>
      </form>
    </div>
  </div>
</nav>

Как разместить строку поиска в конце? Заранее большое спасибо за ответ!

Вернуться на верх