Bootstrap 4: Dropdown menu is going off to the right of the screen

Question

I can\'t seem to get the drop down items to not go off the page. I tried a couple of things from BS3 but they don\'t seem to work. I\'m not sure if its because of the

Answer 1

For the benefit of those who stumble upon this issue when googling but are using react, the accepted answer (whilst correct) won't solve the issue for you. React ignores 'dropdown-menu-right' when you add it manually to the className. Instead, update your code to the below and it correctly sets the same class.

For javascript

For typescript

Putting it in here as this thread appeared when I was googling the issue and took me quite a while to figure out the correct solution for bootstrap 4 in react (reactstrap).