实现CSS导航栏搜索已损坏

前端之家收集整理的这篇文章主要介绍了实现CSS导航栏搜索已损坏前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
导航栏搜索在chrome 50上使用以下任一版本:

实现0.97.6
实现0.97.5

使用的代码如文档中所述:

<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>

代码导致视觉问题,如文档页面以及我的网站所示:

http://materializecss.com/navbar.html

我该如何解决这个问题呢?

解决方法

好的我有同样的问题.但是,我添加了这个CSS,它为我工作.
nav .nav-wrapper form,nav .nav-wrapper form .input-field{
height: 100%;
}

猜你在找的CSS相关文章