html - 溢出自动/滚动在具有巨大 innerhtml 值的 FF 中无法正常工作

标签 html css firefox

这在 30 行上按预期工作,但在插入后增加 block 高度超过 50%,例如100行进去。谁能解释发生了什么?我只在 FF 中注意到这个错误。

<!DOCTYPE html>
<html style="height:100%;">
<head>
    <title></title>
</head>
<body style="height:100%;background:grey;padding:0;margin:0;">
    <table style="height:100%;">
        <tr>
            <td style="height:100%;">
                <div style="background:white;height:50%; overflow: auto">
                    <script>
                        // try 100 to see a bug 
                        for (i = 0; i <= 30; i++) {
                            document.write(i + " Sample text<br>");
                        }
                    </script>
                </div>
                <div style="background:blue; height:50%">
                Sample text
                </div>  
            </td>
        </tr>
    </table>
</body>
</html>

最佳答案

郑重声明:将 tbody 的高度设置为 100% 应该可以解决该问题。使用百分比值时要小心,因为它们有时真的很棘手。

关于html - 溢出自动/滚动在具有巨大 innerhtml 值的 FF 中无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3958808/

相关文章:

javascript - jQuery:防止用户手指触摸元素时页面滚动

html - Bootstrap水平下拉菜单?

linux - Firefox 上的 SVG,Linux 方式

javascript - 单击页面加载时的按钮元素

javascript - 将 JQuery ReplaceWith 与 JavaScript 变量结合使用

css - spring mvc资源问题

css - 如何在 bootstrap 2.3.2 中对齐文本区域中的文本

css - 为什么我不能在 firefox 中使用一些 svg?

html - 文本不显示在图像上

html - 由于添加垂直滚动条,无法获得完整的 PDF View ?