contentEditable with overflow:在表格单元格中滚动不起作用调整为全高

问题描述

我想要一个可编辑的 div,带有填充表格单元格的 scollbars。 所以div的高度应该由(可变的)表几何决定 但情况正好相反:-(滚动条变得无用,表格最大化:-(

<html tyle="height:100%;">
<body style="height:100%;margin:0">
    <style>div{border:1px solid red;font-size:8vh;}</style>

    <div contentEditable="true" id=content style="height:30%;overflow:scroll;">
        div with contentEditable :-)<br/>2<br/>3<br/>4<br/>
    </div>

    <table style="height:30%;width:100%">
        <tr style="height:100%;">
            <td style="height:100%;">
                <div contentEditable="false" id=content style="height:100%;overflow:scroll;">
                    table without contentEditable :-)<br/>2<br/>3<br/>4<br/>
                </div>
                    
            </td>
        </tr>
    </table>

    <table style="height:30%;width:100%">
        <tr style="height:100%;">
            <td style="height:100%;">
                <div contentEditable="true" id=content style="height:100%;overflow:scroll;">
                    same table with contentEditable :-(<br/>2<br/>3<br/>4<br/>
                </div>
            </td>
        </tr>
    </table>
</html>

在 Chrome 浏览器中,表格单元至少被 contentEditable="false" 正确限制,但由于 contentEditable="true" 失败:-( 使用 Firefox,两个表都失败,只有纯 div 工作:-((

在这里测试:http://www.robosoft.de/MinIDE/table2.htm

这里有动态表:http://www.robosoft.de/MinIDE/table.htm

欢迎提出想法:-)

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)