Html 按钮未与输入对齐(由于输入填充)
下面的按钮未与输入对齐。 输入必须与按钮位于同一高度,尽管输入的填充似乎对对齐有影响填充顶部和填充底部之间的差异创建了此按钮的移动 我做了一把小提琴,以表明我的意思 CSS:Html 按钮未与输入对齐(由于输入填充),html,css,alignment,vertical-alignment,Html,Css,Alignment,Vertical Alignment,下面的按钮未与输入对齐。 输入必须与按钮位于同一高度,尽管输入的填充似乎对对齐有影响填充顶部和填充底部之间的差异创建了此按钮的移动 我做了一把小提琴,以表明我的意思 CSS: 。按钮{ 字体大小:15px; 填充:9px 23px; 边界:0; } .表格{ 宽度:290px; 背景色:#F9F9F9; 字号:18px; 颜色:#333; 高度:25px; 边框:1px实心暗光; 填充顶部:15px;使用: 只需在两个元素(按钮和输入)中添加垂直对齐:中间 在您的.form类中,只需将paddi
。按钮{
字体大小:15px;
填充:9px 23px;
边界:0;
}
.表格{
宽度:290px;
背景色:#F9F9F9;
字号:18px;
颜色:#333;
高度:25px;
边框:1px实心暗光;
填充顶部:15px;使用:
只需在两个元素(按钮和输入)中添加垂直对齐:中间
在您的.form
类中,只需将padding top
和padding bottom
值更改为:
.form {
padding-right: 4px;
padding-bottom: 8px;
}
你想知道这一点吗?虽然我希望我的文本在输入中有一些填充,以供那些正在挣扎的人使用,但它同时显示了这两个元素。我第一次读了它。但是谢谢!
<input name="name" class="form" />
<input class="button" type="submit">
vertical-align:middle;
margin-top: -5px;
.form {
padding-right: 4px;
padding-bottom: 8px;
}