Bild in Nav-Leiste einfügen

Question

Ich möchte image/logo inside Nav Bar hinzufügen. So stellen Sie sicher, dass die Höhe der Navigationsleiste immer dem Bild entspricht und die anderen Elemente in der Mitte bleiben.

Ich verwende derzeit nav bar mit Nav-wrapper Klasse von materialize Rahmen.

Ich habe versucht, Min-Höhe zu nav-wrapper hinzuzufügen, aber das die anderen Elemente von der Mitte abrutschen lassen.

Code pen link

Answer 1

wie dies probieren sollte man die für mich arbeiten

Schritt-01 Im hinzugefügt, um diese Klasse navbar-brand

Schritt-02 Im hinzugefügt, um diese 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> 

Codepen