Achieve the height of nav materialize

Question

Achieve the height of nav materialize

Navigation

#1 by (1 votes)

1

I have materialize nav-bar

<!-- Compiled and minified CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/css/materialize.min.css">

  <!-- Compiled and minified JavaScript -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/js/materialize.min.js"></script>
 <nav>
  <div class="nav-wrapper">
    <a href="" class="brand-logo" >KeyBiometric</a>
    <ul id="nav-mobile" class="right hide-on-med-and-down">
      <li><a href="">ingresar</a></li>
      <li><a href="">registrar<span class="new badge">4</span></a></li>
      <li><a href="">informacion</a></li>
      <li><a href="">inicio</a></li>
    </ul>
  </div>
</nav>

I want to reduce the height as I do?

html5 css materialize material-design

asked by hubman 24.02.2017 в 02:49

source

1 answer

How can I traverse a json array, get its values to show them in the view? basic problem in node js with the routes

score 1 · Accepted Answer

You can change it this way:

@media (min-width: 500px) { /* si desea, cambiar tamaño de la pantalla en esta línea */
    nav {
        height: 45px !important;            /* Cambia el valor de lo que quieres */
        line-height: 45px !important;       /* Cambia el valor de lo que quieres */
    }
}

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/css/materialize.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/js/materialize.min.js"></script>

<nav>
    <div class="nav-wrapper">
        <a href="" class="brand-logo" >KeyBiometric</a>
        <ul id="nav-mobile" class="right hide-on-med-and-down">
            <li><a href="">ingresar</a></li>
            <li><a href="">registrar<span class="new badge">4</span></a></li>
            <li><a href="">informacion</a></li>
            <li><a href="">inicio</a></li>
        </ul>
    </div>
</nav>

I've added the media queries in case you only want to change the size just in desktops or whatever, depending on your thoughts about it. I was already thinking ahead.