Having trouble resizing a logo within a navbar-header? Check out the code below:
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<span><a class="navbar-brand toplogo" href="#"><img src="img/beta.png"/></a></span>
</div>
<div>
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="#">Login</a></li>
<li><a href="#">Sign up!</a></li>
<li><a href="#">Home</a></li>
</ul>
</div>
<div>
</nav>
Your CSS code is as follows:
.toplogo {
height : 30%;
width : 30%;
margin-top: 5px;
}
If adjusting .toplogo isn't changing the image size, consider trying different combinations or cascading with .navbar-brand .toplogo. Any tips on resizing the logo in this header structure would be greatly appreciated. Thank you!