NavBar help needed

Guys, why does my

    does not float on the right? I want the three
  • items to align to the right. Help please.

Replace navbar-right with ml-auto in the following ul element class attribute.

class="nav navbar-nav navbar-right"

WHAT!!! haha worked like a charm. Could you please explain?

You have two versions of Bootstrap (3 is first and then 4) in your external CSS files section of your Codepen. navbar-right works with Bootstrap 3 and ml-auto works with Bootstrap 4. It seems that having Bootstrap 4 listed second caused problems with navbar-right. You should pick just one Bootstrap version to use and then use the correct syntax for which ever version you pick.