I have developed a MVC5 application and by default, the nav-bar displays the "application name", "home", "contact", etc. The application name is positioned on the left side of the screen, but I would like to move it to the center. How can I achieve that?
I attempted to change the following code (in the bootstrap.css file) from left to center, but nothing seems to be happening. Any suggestions?
.navbar-brand {
float: left;
padding: 15px 15px;
font-size: 18px;
line-height: 20px;
}
This is the layout cshtml file:
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink(" Application Name", "Index", "Home", null, new { @class = "navbar-brand" })
</div>
@*<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
<li>@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>
</div>*@
</div>
</div>