当我为 textarea 设置填充时，乍一看它还可以。但是当我输入超出文本区域高度的内容时（当您开始看到滚动条时），填充底部不再存在。有没有办法解决这个问题？这似乎是一种默认行为。您可以在这里看到一个非常基本的示例：http: //jsfiddle.net/corinne/LKkky/ PS。使用的浏览器是 Chrome。PS2。刚刚尝试使用 Firefox，实际上填充仍然存在。
问问题
6550 次
4 回答
4
Chrome、Safari 和 Internet Explorer 呈现文本区域填充的方式与 Firefox 和 Opera 不同。现在他们中的哪一个错误地渲染了textareas？这取决于您要实现的目标，因为实际上他们都没有错误地渲染它，他们都添加了填充，这归结为他们如何解释规范。
没有 CSS 属性可以解决此“问题”，因此解决此“问题”的唯一方法是将容器元素添加到 textarea 并为其提供填充。
于 2012-10-03T14:27:11.407 回答
1
实际上，它仍然存在；填写文本框内容后，您只需向下滚动即可查看额外的 20px 填充。我可以建议overflow: hidden。
于 2012-10-03T13:58:00.813 回答
1
您可以将样式分配给font-size: 0;标签form，因为问题是在这样的标签内有一个新行，您需要避免。
完成后，您应该为具有内容的组件分配正确的字体大小，在最简单的情况下是文本区域。
于 2013-10-02T14:05:21.657 回答
0
我现在将我的 textarea 元素包装在一个 div 元素中，然后在其上设置填充和边框。textarea 现在的边框和填充为零。另外，我还隐藏了调整大小手柄。
<label for="giftMessage">Add a gift message
<div class="textAreaWrapper">
<textarea name="gift_message" class="input-text" id="giftMessage" value="" placeholder="Add your message here"></textarea>
</div>
</label>
<style>
.textAreaWrapper {
border:solid 1px #ededed;
padding:15px;
}
textarea.input-text {
width: 100%;
padding: 0;
border:0;
resize: none;
font-size: 16px;
color:#000000;
resize: none;
}
</style>
于 2021-10-26T13:58:53.943 回答