How to position the dropdown submenu like dropup and dropleft bootstrap 4?

Viewed 30

What should I do to position the dropdown submenu to the left top most of the current menu?

This is the problem

1

I want it to be like this

2

<div class="btn-group">
  <button data-toggle="dropdown" class="btn btn-primary dropdown-toggle">
    Action
  </button>
  <ul class="dropdown-menu">
    <li class="dropleft">
      <a class="dropdown-item" href="#">
        <i class="fa fa-prescription"></i
        ><span class="inner-menu-fx">Prescription</span>
      </a>
      <ul class="dropdown-menu dropdown-submenu">
        <li>
          <a class="dropdown-item" href="#">Submenu item 1 Submenu item 1</a>
        </li>
        <li>
          <a class="dropdown-item" href="#">Submenu item 2 Submenu item 1</a>
        </li>
        <li>
          <a class="dropdown-item" href="#">Submenu item 4 Submenu item 1</a>
        </li>
        <li>
          <a class="dropdown-item" href="#">Submenu item 5 Submenu item 1</a>
        </li>
      </ul>
    </li>
  </ul>
</div>

0 Answers
Related