Отступ vuetify v-select

Question

Не получается убрать отступ:

Откуда он берётся? Мне нужно, чтобы селектор был вертикально выровнен по центру. Вот полное изображение:

Рабочий код по ссылке

Разметка:

<div id="app">
  <v-app id="inspire">

      <div class="selectors-menu-section debug">
          <v-select
              :items="[]"
              label="Редактируемые"
              dense
              outlined
          ></v-select>
      </div>
  </v-app>
</div>

Стили:

  .debug {
    border: 2px black solid;
  }

  .selectors-menu-section {
      display: flex;
      flex-direction: row;
      align-items: center;
      padding-left: 20px;
      width: 200px;
  }

Скрипты:

new Vue({
  el: '#app',
  vuetify: new Vuetify(),

})

Answer 1

Добавьте к v-select атрибут hide-details, он так же применим к различным инпутам и выпадающим спискам которые есть внутри vuetify.

Так же бывают ситуации в которых помогают spacing-helpers: https://vuetifyjs.com/en/styles/spacing/

<div id="app">
  <v-app id="inspire">

      <div class="selectors-menu-section debug">
          <v-select
              hide-details
              :items="[]"
              label="Редактируемые"
              dense
              outlined
          ></v-select>
      </div>
  </v-app>
</div>

Answer 2

Правая кнопка мыши -> Просмотреть код.

БЛОГ НА HUSL

Отступ vuetify v-select

Ответы (2 шт):