html - 让自定义提交按钮(图像按钮)与文本输入对齐？

Question

我试图通过使用图像按钮来实现自定义搜索按钮。在上图中，您可以看到我遇到的问题。我已经搜索了很多关于这个主题的话题，但无法修复我的问题。下面是包含文本输入(搜索输入)和图像按钮(绿色图像按钮)的 css 代码。任何和所有的帮助表示赞赏。

CSS:

#search{
    position: absolute;
    right: 350px;
    top: 10px;
    vertical-align: middle;
}

HTML:

<div id='search'>
    <form action='searchquestions.php' method='post' >
    <input type='text' name='searchValue' placeholder='search'>
    <input type='image' src='searchbtn.png' alt='Submit' name='searchSubmit' height='20' width='20'>
    </form>
</div>

Answer 1

检查这个 fiddle ，看看这是不是你需要的

http://jsfiddle.net/94X8S/1/

#search input[type="image"]{
    position:relative;
    top:5px;
}