Html 在文本使用CSS之前，如何在文本区域内保留一些特定维度的空间？

我有一个

。它有一些特定的尺寸，比如说400px 400px。我可以在里面打字。但我应该能够在留下一些空间后打字，如果我清除文本，光标应该停在那里，就像使用backspace一样

下面的图片显示了我想说的话

---

它就像一个div中的div。文本不应该出现在橙色的空间中。这并不意味着div可以充当覆盖层，以便文本可以保留在其下方。这不是一个简单的叠加问题。如何仅使用HTML和CSS来实现这一点？

您可以尝试使用

HTML5 ContentEditable

HTML代码

<div id='wrapper'>
    <div id='box'></div>
    <div contenteditable='true' id='edit'>
    </div>
</div>

#box {
    background-color : orange;
    width : 100px;
    height : 100px;
    float : left;
    margin : 0 10px 10px 0;
}
#wrapper {
    border : 1px solid red;
    padding : 10px;
}
#edit {
    height : 300px;
}

jsiddle演示：

---

看看这是否有用。

你试过什么吗？问得好！在普通的文本区域中，您不能。然而，在像CKeditor这样的所见即所得编辑器中，您可以。。。或者你试着找到一个脚本，可以把一个div改成一个textarea。很好，我也试过同样的方法，但是没有得到。诀窍是将内部div向左浮动。