asp.net - 谁能解决这个 CSS 对齐问题吗？

Question

我在使用 ASP.NET 创建的页面上有一个搜索文本框和两个图像按钮。

当我使用 IE8、Google Chrome 或 Opera 查看页面时，文本框与两个图像按钮不对齐。这些按钮看起来高于文本框，我不知道为什么。

这是关键标记:

<div id=searchbar>
    <div id=Panel1
        onkeypress="javascript:return WebForm_FireDefaultButton(event, 'btnSearch')">
        <input id=txtSearch type=text name=ctl00$txtSearch>
        <input id=btnSearch title=Search src="Test_files/search.png"
            type=image name=ctl00$btnSearch>
        <input id=btnAdvanced title="Advanced Search" src="Test_files/adv.png"
            type=image name=ctl00$btnAdvanced>
    </div>
</div>

注意:我意识到这里有一些奇怪的事情，例如 id 周围没有引号。但在我的资料来源中有引用了它们。上面的代码片段来自从 IE 保存内容，它对标记进行了一些更改。

我还在 http://www.blackbeltcoder.com/Test/Test.htm 发布了相同的代码如果有人愿意看的话。问题在于顶部附近黑条右侧的搜索控件。

谢谢。

Answer 1

尝试

vertical-align:text-bottom;

对于太高的元素。这是一个常见问题。如果这不太正确，您也可以尝试该 CSS 属性的其他选项。看看here