偏移文本区域的文字包，使文字不会被图标遮挡。

Question

我正在开发一个HTML聊天程序。要输入一个信息，用户输入一个 <textarea>. 为了帮助表明文本区域的目的和提高可用性，在文本区域的顶部有一个按钮来发送信息。<textarea>. 然而，当用户输入一个较长的信息时，文本到达行末，部分被图标覆盖。虽然有CSS属性可以控制文本包装的行为，但我找不到任何可以 "偏移 "文本包装的东西，这样新的文本一旦到达图标就会进入新的一行。有什么 CSS 属性或 JS 工作法可以实现这一点吗？

Answer 1

padding-right 好像是这样的。像这样吗？

.wrapper {
    position: relative;
    display: inline-block;
}
textarea {
    padding-right: 20px;
}
button {
    position: absolute;
    top: 0;
    right: 0;
}

<div class="wrapper">
    <textarea rows="7" cols="40"></textarea>
    <button>B</button>
</div>