Just mention width : auto
and it will work fine
.navbar-default .navbar-nav>li {
width: auto;
}
If you mention any static width to li
then if any of the text is too big then it will overflow the li tag.
to make the navbar center:
.navbar {
background: transparent;
border: none;
float: none;
width: 50%; // adjust it as you want
margin: auto;
}