Question

我的文本区域下面有额外的填充，但我似乎无法找到它的来源。我已将个别代码放在此页面上：

我似乎无法找到它的来源。它有类“字段”：

.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; }

任何输入（双关语）将不胜感激：）

Answer 1

要让跨浏览器在textarea / input字段下面没有空格，请使用：

textarea,
input,
select {
  margin: 0;
  vertical-align: bottom;
}

（在小提琴中测试，有效）

奇怪的是垂直对齐是关键。

请注意，您不需要保证金：0因为您已经拥有*{margin:0}。要获得更加完整的textarea跨浏览器体验，您还可以将overflow:auto;用于IE，将resize:none;用于支持调整大小的浏览器。

有关其工作原理的更多信息： Mystery white space underneath image tag

Answer 2

将overflow:auto添加到.field_box，将float:right添加到textarea

<强> DEMO

在您的代码中有float:left标记，在这种情况下，右侧元素应该具有正确的浮动以填充可用的确切空间。否则，您可以使用display:table-row和table-cell

删除浮动并实现此目的

是的，即使vertical-align: bottom也有效。

<强> DEMO 2

Answer 3

据我所知，你的意思是div class= 'field_box'中的填充。在此类中填充0px以删除文本区域下的空间。

如果你的意思是文本区域中的填充：在类.field中make padding = 0px

文本区域下的额外填充

3 个答案: