可移植HTML/CSS，用于将type=image的输入与type=text的输入垂直对齐？

我正在尝试制作这样一个具有水平布局的表单：

<form id="foo" name="foo" method="post" action="fooaction">
    <p>Enter a foo:
        <input type="text" id="fooText" name="fooText"value=""/>
        <input type="image" name="yes" id="fooSubmitYes" value="1" src="yes.png" title="Yes" width="24" height="24"/>
    <input type="image" name="no" id="fooSubmitNo" value="0" src="no.png" title="No" width="24" height="24"/>
    </p>
</form>

输入一个foo：

我遇到的问题是，第一个输入，文本框，与文本“enterafoo:”对齐良好，但其他两个输入与文本框对齐非常差；它们大约有7个像素太高了。所有这些元素的边距和填充都设置为0

如果我将align=“middle”添加到图像输入中，那么它们会向下移动12个像素，因此它们太低了5个像素，这让我感到困惑。更令人困惑的是，CSS垂直对齐属性并不影响输入元素（它们忽略了它），所以我很难想象如何在CSS中解决这个问题

是否有人知道一种浏览器便携方式，可以制作一个带有标题、输入文本框和两个水平布局和一致垂直对齐的提交图像的表单？如果没有，我会满足于在Firefox中工作的东西：）（95%的用户）。

添加以下内容：

style='vertical-align: bottom'

在Firefox和IE中，

元素对我来说很好

这使图像的底边与输入框的底边对齐

（默认情况下，它们“太高”的原因是内联图像的底边与文本的基线对齐-下面的间隙用于容纳文本偏心：q、p、g等。）

---

我不知道是什么让你说“CSS垂直对齐属性不影响输入元素”，但它对我来说是有效的-也许还有其他问题阻止了它对你的作用。

WOW。我不敢相信我没试过。这对我也有用！谢谢CSS文档说只有img和div元素可以垂直对齐中间，垂直对齐：中间完全不影响它们，但底部可以！为什么中间比底部低，我不知道。这东西太不稳定了，太可怕了。再次感谢@肖恩：这里解释了各种选项：“middle”比“bottom”低，因为“middle”表示“将图像的中间部分与文本中小写字母的中间部分对齐”，而“bottom”表示“将图像的底部与行中最底部元素的底部对齐”。这些值太简短，如果不查找其含义，就没有意义。