vue-выбор с помощью гибкого контейнера

#css #flexbox #core-ui #vue-select

#css #flexbox #ядро-пользовательский интерфейс #vue-выбор

Вопрос:

Я пытаюсь использовать v-select в панели администратора в заголовке (используя CoreUI). У меня есть контейнер с «display: flex» https://codepen.io/kat15pl/pen/NWNZgQg

 <div id="app" class="c-app">
  <div class="c-wrapper">
    <header class="c-header c-header-light c-header-fixed c-header-with-subheader">
      <ul class="c-header-nav d-md-down-none mr-auto">
        <li style="width: 100%;">
          <v-select :options="options"/>
        </li>
        <li>
          next div
        </li>
      </ul>
    </header>
  </div>
</div>
  

Я думаю, что я делаю что-то не так… но я не вижу, что: (
Я не хочу изменять размер при открытии выбора.
Я имею в виду, почему ввод не может быть 100%?

Результат