Bootstrap - Navbar is Expanding - html

Question

I have a Bootstrap Navbar that has lot of tabs. The Bootstrap Nav Bar looks like this.
Is there any way to prevent it.
The HTML Code:
<link rel="stylesheet" href="CDNs/bootstrap.css">
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">v1.0</a>
</div>
<ul class="nav navbar-nav">
<li style="float:right">Upload</li>
<li style="float:right">Events of ©</li>
<li style="float:right">Tracker</li>
<li style="float:right"><span class="glyphicon glyphicon-pencil"></span> Return</li>
<li style="float:right"><a href="#"><span class="glyphicon glyphicon-inbox"></span> My< /a></li>
<li style="float:right"><span class="glyphicon glyphicon-user"></span> SignOut</li>
<li style="float:right"><a class="navbar-brand" href="#"><?php
echo "Logged in as " . $_SESSION["username"] . "<br>";
?></a></li>
</ul>
</div>
</nav>
*I have masked few tab names and edited the tab names in the code due to security issues*
Thanks,

Answer 1

If what you need is to have them all in one line, this fiddle should work.
These were the only properties needed:
.nav.navbar-nav {
display: inline-block;
float: right;
}
ul.nav.navbar-nav > li {
display: inline-block;
}
Here is the image:
You can see all tabs are in order (the signOut tab looks like that because it has an anchor tag on top of it).

Answer 2

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

Answer 3

There are few mistakes in your markup
1) There is an extra space on your closing < /a> tag in your "My" option
<li style="float:right"><a href="#"><span class="glyphicon glyphicon-inbox"></span> My< /a></li>
Remove this.
2) Next remove all your inline style (float:right;). If you want to shift all towards right then just add the class navbar-right to your <ul> like this
<ul class="nav navbar-nav navbar-right">
<li></li>
<li></li>
<li></li>
</ul>
Codepen here