保持文本区域内的填充 [英] Maintaining a padding inside of text-area

查看:77
本文介绍了保持文本区域内的填充的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的文本区域内,我希望从顶部开始保持30px的填充.

Inside of my textarea, I wish to maintain a padding of 30px from the top.

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

但是,一旦在文本区域中填充了文本并且内容开始滚动.不再保留填充.

However, once the text-area is filled with text and the content starts scrolling. The padding is no longer maintained.

http://jsfiddle.net/w47wbq77/

运行此小提琴时,最初会注意到从顶部(在textarea内部)的填充保持不变.但是,当您超过150个字符时,填充就消失了.

When you run this fiddle, initially you'll notice that the padding from top (inside of the textarea) is maintained. However, the minute you have more than 150 characters, the padding is gone.

有什么解决办法吗?

推荐答案

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

I would remove all styling from the text area, and wrap it in a div that looks like a text area

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

textarea { padding: 0 }

您可能不得不摆弄边框半径等,但这也许可以做到

You might have to fiddle about with border radius etc, but that would maybe do it

这篇关于保持文本区域内的填充的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆