Materialise CSS Navbar ricerca è rotto

Question

Navbar di ricerca è suddiviso su Chrome 50+ utilizzando uno dei seguenti versioni:

materializzano 0.97.6 materializzano 0.97.5

codice utilizzato è, come descritto nella documentazione:

<nav> 
    <div class="nav-wrapper"> 
     <form> 
     <div class="input-field"> 
      <input id="search" type="search" required> 
      <label for="search"><i class="material-icons">search</i></label> 
      <i class="material-icons">close</i> 
     </div> 
     </form> 
    </div> 
    </nav> 

questo codice porta a problemi visivi come illustrato nella pagina di documentazione, così come il mio sito:

http://materializecss.com/navbar.html

Come posso risolvere questo problema per farlo sembrare uniforme?

Answer 1

OK, ho riscontrato lo stesso problema. Tuttavia, ho aggiunto questo CSS e ha funzionato per me.

nav .nav-wrapper form, nav .nav-wrapper form .input-field{ 
height: 100%; 
} 

Answer 2

ho appena notato questo oggi e ho appena fatto questo:

input[type="search"] { 
    height: 64px !important; /* or height of nav */ 
}