我想添加image/logo inside Nav Bar
。
如何确保导航栏高度始终适合图像,其他元素保持在中心位置。
我目前正在使用Nav-wrapper
框架中materialize
类的导航栏。
我尝试将min-height添加到nav-wrapper
,但这会让其他元素从中心滑落。
答案 0 :(得分:1)
试试这个为我工作
step-01 我添加了这个课程navbar-brand
step-02 我添加了这个CSS
.navbar-brand {
padding: 0px;
}
.navbar-brand>img {
height: 64px;
padding: 0px;
width: auto;
}
.black {
background-color: #111 !important;
}
<强> NAV 强>
<nav>
<div class="nav-wrapper black">
<div class="container">
<a href="#" class="navbar-brand"><img src="http://www.becomeanengagedemployee.com/wp-content/uploads/2012/03/flow-200x75.jpg"></a>
<ul id="Nav2" class="right hide-on-med-and-down">
<li><a href="#"><i class="material-icons">search</i></a></li>
<li><a href="#"><i class="material-icons right">refresh</i>Link with Left Icon</a></li>
<li><a class="waves-effect waves-light btn">Button</a></li>
</ul>
</div>
</div>
</nav>