How to make overflow work in different browsers?

Question

css

Good afternoon, dear experts, why overflow does not work in Mozilla Firefox, you can try to open it in Chrome and in Mozilla it works differently, the main point is that the block is scrolled from the bottom up and the blocks are built in the same way.

https://codepen.io/GaldarTurin/pen/xxGOMdM

Any hint would be welcome!

Answer 1

#main .chat {
    height: auto;
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    /* display: flex; */
    /* flex-direction: column-reverse; */
}