Similar questions were asked already but there are pretty old and none is actually working for me. Problem: the last element of the menu do not go right despite applying following styles to it:
1 text-align: right; float: none; 2 pull-right 3 float-right
My menu code looks like this:
<nav class="nav navbar-toggler">
<div class="navbar-brand">
<img src="../../../assets/banner-1.png">
</div>
<h1 class="navbar-text h1">{{ title }}</h1>
</nav>
<nav class="nav nav-header">
<div class="form-inline container">
<a class="nav-item nav-link menu-item active" href="#">Home <span class="sr-only">(current)</span></a>
<a class="nav-item nav-link menu-item" routerLink="/app-registrations-browser">Applications</a>
<a class="nav-item nav-link menu-item" routerLink="/users">Users</a>
<a class="nav-item nav-link menu-item" routerLink="/inspections">Inspections</a>
<a class="nav-item nav-link menu-item" routerLink="/cpe">CPE</a>
<a class="nav-item nav-link menu-item" routerLink="/reports">Reports</a>
<a class="nav-item nav-link menu-item" routerLink="/help">Help</a>
<a class="nav-item nav-link" style="color: ghostwhite; text-align: right; float: none;">Logged User</a>
</div>
</nav>
Are there other ways to force last item to go right?
