html - 在文本区域内保持填充

Question

在我的文本区域内，我希望从顶部保持 30 像素的填充。

textarea {
    display: block;
    width: 300px;
    height: 50px;
    padding-top: 30px;
}

但是，一旦文本区域被文本填充并且内容开始滚动。填充不再维护。

http://jsfiddle.net/w47wbq77/

当你运行这个 fiddle 时，最初你会注意到顶部(文本区域内部)的填充被保留了下来。然而，当您有超过 150 个字符时，填充就消失了。

有什么解决办法吗？

Answer 1

我会删除文本区域的所有样式，并将其包装在看起来像文本区域的 div 中

.wrapper { 
  border: 1px solid #aaa; 
  padding-top: 30px; 
}

textarea { padding: 0 }

你可能不得不摆弄边界半径等，但也许就可以了