Прокрутка не работает с фреймворком CSS3 в Firefox

Я использую box-flex для моего макета, но я не могу получить прокрутку строки flex.

HTML:

<div class='dashboard'>
  <div><button>Widget</button></div>
  <div class="noboard"><button>Yammer</button>
  <div class="yammerboard" >
      <div><button>Dashboard22</button></div>
      <div><button>Dashboard22</button></div>
      <div><button>Dashboard22</button></div>
      <div><button>Dashboard22</button></div>
      <div><button>Dashboard22</button></div>
  </div>
  </div>
  <div><button>Notifications</button></div>
</div>

CSS

.dashboard {
    display: box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    box-orient:vertical;
    -ms-box-orient: horizontal;
    -moz-box-orient:horizontal;
    -webkit-box-orient: horizontal;
    border: solid 2px black;
    overflow-y:auto;
}
.noboard {
    display: box;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    box-orient:vertical;
    -ms-box-orient: vertical;
    -moz-box-orient:vertical;
    -webkit-box-orient: vertical;
    overflow-y:auto;
}
.yammerboard {
    display: box;
    display: -webkit-box;
    display: -moz-inline-box;
    display: -ms-box;
    box-orient:vertical;
    -ms-box-orient: vertical;
    -moz-box-orient:vertical;
    -webkit-box-orient: vertical;
    overflow-y:scroll;
    -moz-box-sizing: inherit;
    box-flex: 0;
    -ms-box-flex: 0;
    -moz-box-flex: 0;
    -webkit-box-flex: 0;
    -moz-box-lines:multiple;
}

В Firefox я хочу, чтобы он прокручивался с помощью overflow:auto и чтобы окно flex не расширялось по вертикали. Настройка box-flex: 0; не работает.

Любые предложения о том, как достичь этого?

Ответы

Ответ 1

У меня была аналогичная проблема с вертикальной прокруткой на гибкой коробке в Firefox. Когда контент переполняется вертикально, Firefox будет отображать полоски прокрутки, но без ручек прокрутки, и поле содержимого остается фиксированным и не поддающимся проверке.

Я решил проблему, просто добавив минимальную высоту в поле с свойством flex-box. В любом случае мне нужно было установить минимальную высоту, но вы можете взломать минимальную высоту: 1px в любом случае.

Я тестировал это поведение только в Firefox 13, YMMV.

Ответ 2

Ярлыки Flex довольно изворотливы в Firefox прямо сейчас, это немного не обновлено. Известно, что они не работают с фиксированными или абсолютными позиционируемыми элементами. Также пусть будет известно, что для гибких ящиков для работы в Firefox существует ширина, иначе она будет рассматриваться как встроенный блок.