html - 包含输入类型 ="submit"的 td 变得比输入高,浏览器之间的数量不同

标签 html css

我有一个包含输入的表格单元格:

<body>
  <table>
    <tr>
      <td><input type="submit" class="submitbutton" value=""/></td>
    </tr>
  </table>  
</body>

该输入的样式设置为 20 像素的高度:

table
{
  border-spacing: 0;
  border-collapse: collapse;
}

td
{
  padding: 0;
}

.submitbutton
{
  width: 19px;
  height: 20px;
  border: 0px;
  outline: none;
  margin:0;
}

http://jsfiddle.net/VhhPf/2/

当我使用 firefox 并查看布局选项卡时,我可以看到输入的高度为 20,但由于某种原因 td 的高度为 21。在 chrome 中,td 的高度为 24。

为什么?

enter image description here

enter image description here

enter image description here

enter image description here

最佳答案

它是一个内联元素,因此它与文本的基线对齐。

添加vertical-align:bottom

另见 this question .

关于html - 包含输入类型 ="submit"的 td 变得比输入高,浏览器之间的数量不同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21042339/

相关文章:

像 BluePrint/960gs 这样的 HTML5+CSS3 框架?

java - 在 DIV HTML 中遍历或查找元素的最快方法

JavaScript 和 CSS : How to log position of a div between css translate start and end

html - 沿图像垂直对齐 div

css - 使CSS图像绝对路径转到子目录的根目录,而不是主域的根目录

html - 如何使此 Navbar 正确粘贴?

html - 版权声明的语义 HTML 标记

jquery.datePicker 问题

html - z-index 不适用于相对父元素和之后/之前元素

html - html 标记中 css 类之间的额外空间