In Bootstrap 4, NavBar is an essential component for menu purposes. To align menu items to right by using float-right class is works well in Bootstrap 3, but it doesn't work in Bootstrap 4 because the navbar is now flexbox. The following approach will explain clearly.
In Bootstrap 4, NavBar contains so many items like text, link text, disable the link, dropdown buttons, forms, etc. To align text, link text, disable link and dropdown buttons to the right use
class="text-right". But for forms use form
class="flex-row-reverse" to align right within NavBar. Using CSS properties might also help to align right within NavBar if the default class not needed.
Below example illustrates how to set hamburger items on the right in bootstrap 4.
Example:
Output:
👁 Image
Reference: https://getbootstrap.com/docs/4.0/components/navbar/