Как добавить элементы для прокрутки?

Question

Как я могу добавить элементы, чтобы прокручивать их?

---

Answer 1

Существует хак с помощью transform: scaleY(-1), чтобы начать добавлять элементы из нижней

1. transform: scaleY(-1) на контейнере, чтобы инвертировать ее вертикально

2. transform: scaleY(-1) на детей контейнера, чтобы исправить инверсия на детей.

3. Даже переполнение контейнера начинается со дна!

Смотреть демо ниже:

body { 
 
    margin: 0; 
 
} 
 
* { 
 
    box-sizing: border-box; 
 
} 
 
.wrapper { 
 
    border: 1px solid red; 
 
    height: 100vh; 
 
    overflow-y: auto; 
 
    transform: scaleY(-1); 
 
} 
 
.wrapper > div { 
 
    height: 100px; 
 
    width: 50vh; 
 
    border: 1px solid; 
 
    margin: 10px auto; 
 
    transform: scaleY(-1); 
 
    /*align text inside*/ 
 
    display: flex; 
 
    justify-content: center; 
 
    align-items: center; 
 
}

<div class="wrapper"> 
 
    <div>1</div> 
 
    <div>2</div> 
 
    <div>3</div> 
 
    <div>4</div> 
 
    <div>5</div> 
 
</div>

Позвольте мне знать ваше мнение по этому вопросу. Благодаря!

Answer 2

Является ли это то, что у значит?

<div style="overflow-y:scroll;, height: 5px;"> 
    <span></span> 
    <span></span> 
    <span></span> 
    <!-- any number of elements you want--> 
</div>