Html 输入的垂直对齐

这是我的代码：

.输入{
保证金：0；
边框：1px实心#c8d1d7；
字体大小：14px；
填充：10px 12px；
字体大小：300；
边界半径：3px；
框大小：边框框；
}
.输入表格{
宽度：100%；
显示：块；
}
.搜索{
宽度：728px；
保证金：0自动；
}
.search.text{
宽度：300px；
保证金权利：30px；
}
。搜索。提交{
背景尺寸：20px 20px；
背景图像：url（'http://www.clker.com/cliparts/n/U/H/1/H/u/search-icon-white-one-hi.png');
背景重复：无重复；
背景位置：中心；
字号：0；
高度：38px；
宽度：60px；
}

---

我不明白为什么提交按钮低于其他输入？我做错了什么？

您可以在提交按钮上添加

垂直对齐：顶部

：

.search .submit {
background-size: 20px 20px;
background-image: url('http://www.clker.com/cliparts/n/U/H/1/H/u/search-icon-white-one-hi.png');
background-repeat: no-repeat;
background-position: center;
vertical-align: top;
font-size: 0;
height: 38px;
width: 60px;
}

加上

.submit{

    vertical-align:middle;
}

或

.submit{

    vertical-align:top;
}

---

线索就在你的问题标题中：好的，那么我应该应用一个基线中间或顶部，还是无关紧要。是否需要输入并提交或仅输入？如果要忽略

垂直对齐

，可以将提交设置为

浮动：右。。。好的，那么我应该应用一个基线中间或顶部-只有你知道答案，你希望它们垂直对齐在哪里？如果这是完整的表单标记，那么我的选择将是
form.search输入{vertical align:middle；}
@George:这就是为什么在我的答案中都添加了这两个内容
.submit{

    vertical-align:top;
}