Right align element in div class

Question

I am using angular 2 with Bootstrap 4 and Angular Material. However, I am having trouble right align the elements inside my container div. I want both my button and text to

Answer 1

In Bootstrap 4, pull-right has been replaced with float-right.

If float-right is not working, remember that Bootstrap 4 is now flexbox, and many elements are display:flex which can prevent float-right from working. In some cases, the utility classes like align-self-end or ml-auto work to right align elements that are inside a flexbox container like a Bootstrap 4 .row, Card or Nav. The ml-auto (margin-left:auto) is used in a flexbox element to push elements to the right.

Also, remember that text-right still works on inline elements.

Bootstrap 4 align right examples