让自定义提交按钮（图像按钮）与文本输入对齐？答案

【问题标题】：Getting custom submit button (image button) to line up with text input?让自定义提交按钮（图像按钮）与文本输入对齐？
【发布时间】：2014-05-20 01:15:13
【问题描述】：

我正在尝试通过使用图像按钮来实现自定义搜索按钮。在上图中，您可以看到我遇到的问题。我已经搜索了很多关于这个主题的主题，但无法修复我的主题。下面是包含文本输入（搜索输入）和图像按钮（绿色图像按钮）的 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>

【问题讨论】：

请发布您的 html 标记。 #search 也是容器名称、输入名称还是按钮名称？
#search 是 div 容器
这个需要源码。

标签： html css vertical-alignment imagebutton search-box

【解决方案1】：

检查这个小提琴，看看这是你需要的

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

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

【讨论】：