[Vuejs]-How to make my navbar fit 100% the height of the website

by

2👍

✅

Try using height: 100vh

vh is a unit which is relative to 1% of the height of the viewport

          <div class="navbar">
            <div class="navbar-nav">
              <ul>
                <li><a href="">Home</a></li>
                <li><a href="">About</a></li>
              </ul>
            </div>
          </div>


        <style scoped>
        .navbar {
          width: 20%;
          height: 100vh;
          background-color: greenyellow;
        }

        .navbar-nav {
          display: flex;
          flex-direction: column;
        }

        .check {
          justify-self: flex-end;
        }
        </style>
👤Ran Marciano

1👍

.navbar {
  width: 20%;
  height: 100vh;
  background-color: greenyellow;
}

.navbar-nav {
  display: flex;
  flex-direction: column;
}

.check {
  justify-self: flex-end;
}
<div class="navbar">
    <div class="navbar-nav">
      <ul>
        <li><a href="">Home</a></li>
        <li><a href="">About</a></li>
      </ul>
    </div>
  </div>
👤Rajkiran Shetty

Leave a comment