When using ngbDropdown, the default alignment of drop down items is on the right side. However, if the drop down alignment is too far to the right, the item may become invisible.
Below is the HTML code:
<div ngbDropdown class="d-inline-block float_right">
<span id="dropdownBasic1" ngbDropdownToggle class="cursor-pointer">Sort by</span>
<div ngbDropdownMenu aria-labelledby="dropdownBasic1">
<button class="dropdown-item">Name</button>
<button class="dropdown-item">Date of creation</button>
</div>
</div>
I attempted to use the class dropdown-menu-left to align the drop down items to the left, but it was unsuccessful. How can I properly align the drop down items to ensure they display on the left side without breaking the text?