如何在bootstrap CSS中阻止下拉菜单向右移动

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">

<div class="dropdown">
  <button class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown" aria-expanded="false">
    下拉菜单
  </button>
  <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <li><a class="dropdown-item" href="#">菜单项1</a></li>
    <li><a class="dropdown-item" href="#">菜单项2</a></li>
    <li><a class="dropdown-item" href="#">菜单项3</a></li>
  </ul>
</div>

<style>
  .dropdown-menu {
    right: auto !important;
  }
</style>