Css溢出不适用于Firefox

css文件

 #log{
    -webkit-box-flex: 1;
    padding-top: 20px;
    overflow: scroll   ;
    height: 150px;
    color: #23568a;
    font-size: large;
    font-weight: bold;
    display: flex;
    flex-direction: column-reverse;

    }

在html文件中， 我是这样使用日志的

 <div id="receiveBox">
        <h2>Receive </h2>
        <div id="log"></div>
    </div>

socket.on('my_response', function(msg) {
                $('#log').append('<br>' + $('<div/>').text('Received #' + msg.count + ': ' + msg.data).html());
            });

使用 溢出：滚动； 我尝试将滚动条添加到它将拆分的结果中，但滚动条仅在Safari和Chrome中显示，而不在Firebox中显示。

---

如何使其在firefox中工作？？？

前后评论后编辑：

要使其在添加新数据时自动向下滚动div，请在socket.on之后向js添加以下代码：

但是，在查看了HTML和CSS，并在Firefox中使用一些虚拟数据进行了测试之后，看起来只是flex方向导致了问题。不带那个试试

因此，只需评论一下这篇文章：

/* flex-direction: column-reverse; */

---

寻求代码帮助的问题必须包含在问题中重现问题所需的最短代码，最好是在堆栈片段中。虽然您提供了一个链接，但如果该链接无效，您的问题对其他将来遇到相同问题的用户将毫无价值。请看。链接只是一个可能的解决方案，应该或不应该实施。我已经把问题贴在上面了。问题中应该有代码来演示这个问题。我应该包括我的整个.css文件吗？不，刚好可以演示这个问题。一个最低限度的演示是必需的。滚动条确实来了，谢谢。但是我需要到这一页的底部。现在，我必须向下滚动。它会自动向下移动吗？因此，您希望它在加载数据时不断向下滚动，直到加载完所有数据后在页面底部结束？是的，在输入数据时向下移动您是希望框内有滚动条，高度固定，还是只想让所有数据显示在整个页面的滚动条下？编辑：我看到你有高度：150px，所以你可能想要固定高度？不，我想框是固定高度。它不应该贯穿整页。

socket.on('my_response', function(msg) {
    $('#log').append('<br>' + $('<div/>').text('Received #' + msg.count + ': ' + msg.data).html());
});

/* flex-direction: column-reverse; */