使用水平滚动条时文本区域右填充？

Question

创建带有水平滚动条的

textarea

时，如何启用右侧内边距？

确实，CSS

padding

适用于右上角，但不适用于右侧：

textarea {
  white-space: pre;
  overflow-wrap: normal;
  overflow-x: scroll;
  border: 1px solid black;
  height: 5rem;
  width: 14rem;
  padding: 0.75rem;
}

<textarea>foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar</textarea>

Answer 1

有趣的问题。 我会使用内容可编辑的 div。

<div contenteditable="true">foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar foo bar</div>


div {
    white-space: pre;
    overflow-wrap: normal;
    overflow-x: scroll;
    border: 1px solid black;
    height: 5rem;
    width: 14rem;
    padding: 0.75rem;
}