[英]Extra padding under text area
My text area has extra padding under it but I cant seem to find the source of it. 我的文本区域下面有额外的填充,但我似乎无法找到它的来源。 I have put the individual code on this page: 我已将个别代码放在此页面上:
http://jsfiddle.net/wfuks/ http://jsfiddle.net/wfuks/
I cant seem to find the source of it. 我似乎无法找到它的来源。 It has class "field": 它有类“字段”:
.field { background-color: white; width: 430px; padding: 10px; font-family:arial, sans-serif; border: 1px solid #CCC; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; }
Any input (pun) would be appreciated :) 任何输入(双关语)将不胜感激:)
To have cross browser no white space below textarea/input fields use: 要使用跨浏览器,textarea / input字段下面没有空格,请使用:
textarea,
input,
select {
margin: 0;
vertical-align: bottom;
}
(tested in your fiddle, works) (在小提琴中测试,有效)
Oddly the vertical align is the key here. 奇怪的是,垂直对齐是关键。
Just a note, you don't need the margin:0 because you already have *{margin:0}
. 只需注意,您不需要保证金:0因为您已经拥有*{margin:0}
。 For an even more complete cross browser experience for textarea you could also use overflow:auto;
要获得更加完整的textarea跨浏览器体验,您还可以使用overflow:auto;
for IE and resize:none;
对于IE和resize:none;
for browsers with resizing support. 适用于调整大小支持的浏览器。
Some more info about why it works like it works: Mystery white space underneath image tag 有关它为何如此工作的更多信息: 图像标记下方的神秘白色空间
Add overflow:auto
to .field_box
and float:right
to textarea
添加overflow:auto
到.field_box
和float:right
到textarea
In your code there is float:left
to label, in that case the right element should have the right floating to fill the exact space available. 在你的代码中有float:left
to label,在这种情况下,右边的元素应该有正确的浮动来填充可用的确切空间。 otherwise you can remove floats and achieve this by using display:table-row
and table-cell
否则你可以删除浮动并通过使用display:table-row
和table-cell
And yes even vertical-align: bottom
works. 是的甚至vertical-align: bottom
工作。
To my understanding you mean the padding in the div class= 'field_box'
. 据我所知,你的意思是div class= 'field_box'
的填充。 Make the padding to 0px
in this class to remove the space under text area. 在此类中将填充设置为0px
以删除文本区域下的空间。
If you mean the padding in the text area: make padding= 0px in class .field
如果你的意思是文本区域中的填充:在类.field
make padding = 0px
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.