Неправильная ширина панели md-select в контейнере макета при использовании layout = row и flex = auto

Question

У меня проблема с панелью md-select, которая отображается после нажатия на компонент md-select. Проблема в том, что эта панель слишком широка и достигает правого края браузера.

Вот макет. Когда в макете контейнера есть только один элемент, например. s1 или s2, тогда md-select панель имеет правильно рассчитанную ширину. Но когда я пытаюсь объединить оба в макете контейнера, как в примере ниже, панель s2 md-select становится широкой после нажатия на селектор s2.

<div layout-padding layout-fill layout="row" layout-align="start center">
  <div flex="auto" id="s1">
    <md-select ng-model="ctrl.weeks" placeholder="Select first week">
      <md-option ng-value="1">One</md-option>
      <md-option ng-value="2">Two</md-option>
    </md-select>
  </div>
  <div flex="auto" id="s2">
    <md-select ng-model="ctrl.weeks" placeholder="Select second week">
      <md-option ng-value="1">One</md-option>
      <md-option ng-value="2">Two</md-option>
    </md-select>
  </div>
</div>

Кто-нибудь знает обходной путь для такого рода проблем? Я не использую трюки с CSS. Кажется, это ошибка. Я использую angularjs 1.7.7 и angular-материал 1.1.13.