Изменить порядок вывода блоков с возможностью прокрутки

Question

Я бы хотел узнать, как сделать, что бы этот блок прокручивался в браузере firefox. Я пробовал у родительского блока добавить min-height: 0;, не помогает. Заранее спасибо!

.parent{
  width: 200px;
  height: 200px;
  display: flex;
  flex-direction: column-reverse;
  overflow: scroll;
}
.parent div{
  width: 80%;
  background: #aaa;
  margin-top: 5px;
}

<div class="parent">
  <div> 1 </div>
  <div> 2 </div>
  <div> 3 </div>
  <div> 4 </div>
  <div> 5 </div>
  <div> 6 </div>
  <div> 7 </div>
  <div> 8 </div>
  <div> 9 </div>
  <div> 10 </div>
  <div> 11 </div>
  <div> 12 </div>
  <div> 13 </div>
  <div> 14 </div>
</div>

Answer 1

document.querySelector('.parent').scrollTo(0, 999999999);

.parent {
  width: 200px;
  height: 200px;
  overflow-y: scroll;
}

.viewport {
  display: flex;
  flex-direction: column-reverse;
}

.viewport div {
  width: 80%;
  background: #aaa;
}

.viewport div:not(:last-child) {
  margin-top: 5px;
}

<div class="parent">
  <div class="viewport">
    <div> 1 </div>
    <div> 2 </div>
    <div> 3 </div>
    <div> 4 </div>
    <div> 5 </div>
    <div> 6 </div>
    <div> 7 </div>
    <div> 8 </div>
    <div> 9 </div>
    <div> 10 </div>
    <div> 11 </div>
    <div> 12 </div>
    <div> 13 </div>
    <div> 14 </div>
  </div>
</div>

БЛОГ НА HUSL

Изменить порядок вывода блоков с возможностью прокрутки

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