title: Vuetify navbar grows and scrolls along with a list, when it should remain static
body: <p>I have an app with a navbar which should remain static on the left side of the screen.
  On the rest of the screen there is a list of items, which can be unlimited for all I care.</p>
  <p>The issue is, the navbar is growing to match that list and is scrolling along. I want it to be static regardless of the list's size.</p>
  <p>App.vue file template:</p>
  <pre><code>&lt;template&gt;
      &lt;div id=&quot;app&quot;&gt;
          &lt;v-app&gt;
              &lt;v-row&gt;
                  &lt;navbar/&gt;
                  &lt;v-main&gt;
                      &lt;v-container class=&quot;main-container&quot;&gt;
                          &lt;my-item-list/&gt;
                      &lt;/v-container&gt;
                  &lt;/v-main&gt;
              &lt;/v-row&gt;
          &lt;/v-app&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  <p>This is what my Navbar component looks like:</p>
  <pre><code>&lt;template&gt;
      &lt;v-navigation-drawer v-model=&quot;drawer&quot; :mini-variant.sync=&quot;mini&quot; permanent&gt;
          &lt;v-layout justify-space-between column fill-height&gt;
              &lt;v-list&gt;
                  &lt;v-list-item class=&quot;px-2&quot;&gt;
                      &lt;v-list-item-avatar&gt;
                          &lt;v-img src=&quot;http://placekitten.com/200/300&quot;&gt;&lt;/v-img&gt;
                      &lt;/v-list-item-avatar&gt;
                  &lt;/v-list-item&gt;
  
                  &lt;v-divider&gt;&lt;/v-divider&gt;
                  &lt;v-list-item
                      v-for=&quot;setting in settings.top&quot;
                      :key=&quot;setting.id&quot;
                  /&gt;
              &lt;/v-list&gt;
  
              &lt;v-list&gt;
                  &lt;v-list-item
                      v-for=&quot;setting in settings.bottom&quot;
                      :key=&quot;setting.id&quot;
                  /&gt;
              &lt;/v-list&gt;
          &lt;/v-layout&gt;
      &lt;/v-navigation-drawer&gt;
  &lt;/template&gt;
  </code></pre>
  <p>Here are also some screenshots of what is going on:</p>
  <p><a href="https://i.stack.imgur.com/VyMFV.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VyMFV.png" alt="enter image description here" /></a></p>
  <p>As you can see here I have all the item of my navbar nicely fitting in my screen, which is how I want it.</p>
  <p>However, in the next image:</p>
  <p><a href="https://i.stack.imgur.com/H7Yec.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/H7Yec.png" alt="enter image description here" /></a></p>
  <p>We now have so many items that it causes the screen to scroll, which is fine btw. The issue is, you can see that the navbar also stretches out to match the scrolling of the items. I would like the navbar to stay just the same as in the first image regardless of how many items are added.</p>