Css 提交输入和标签在表单内部不对齐

从图中可以看出，“浏览文件”和“上传”这两个看起来像按钮的东西没有对齐

问题是提交输入“Upload”的上边框和

的上边框之间有1个像素。所以在它们之间有一个1px的空白。“浏览文件”本身与

顶部边框之间没有此空白

.center\u框{
宽度：600px；
背景：rgba（0,0,0,0.2）；
利润率：40px自动；
文本对齐：左对齐；
}
.上载\u固件\u容器{
颜色：白色；
边缘顶部：20px；
文本对齐：居中；
}
.上传\u固件\u容器表单{
边缘顶部：30px；
}
.file\u输入\u标签{
显示：内联块；
宽度：200px；
高度：30px；
线高：30px；
背景色：#e11422；
边界：无；
盒影：0px 4px 10px rgba（0,0,0,0.5）；
右边距：20px；
颜色：白色；
字号：18px；
字体大小：粗体；
光标：指针；
}
#档案{
显示：无；
}
输入[type=“submit”i]{
填充：0；
}
.上传按钮{
显示：内联块；
宽度：200px；
高度：30px；
背景色：#1489e1；
边界：无；
盒影：0px 4px 10px rgba（0,0,0,0.5）；
颜色：白色；
字号：18px；
字体大小：粗体；
光标：指针；
边缘底部：20px；
}
.上传按钮：悬停，.上传按钮：焦点{
背景色：#0e5e9b；
大纲：0；
}

浏览文件

试试这个：

input[type="submit" i] {
    vertical-align: top;
}

---

使用您共享的代码，我们无法重现问题。即使在我使用了

input[type='file']

上的

display:none

之后，我想您还是忘了将其放入代码中。那么，你能在这个片段中重现你的问题吗？@MihaiT Done！我认为添加大量代码是违反政治的……但这段代码似乎仍然没有重现问题，至少在Chrome中，我找不到任何与您描述的问题类似的东西。@04FS这很奇怪。我也在使用Chrome，我可以在代码片段中看到错位。。我们谈论的是1px的差异。如果你放大它就不行了。放大后，提交会移动。无缩放，无差异-我在绿色矩形中绘制，按钮有1px的边距，它们在同一水平线上对齐，没有问题。这实际上是可行的。仅<代码>垂直对齐：顶部是必需的<代码>填充不起任何作用。如何仅将此规则指定给此输入

？@MihaiT在我的情况下：

.upload\u firmware\u container input{}

。谢谢

.upload\u firmware\u container input.upload\u按钮{}

通过此按钮，因为您还有其他具有不同类名的输入

重新启动设备

，所以如果您使用上述规则，它将只针对“upload Files”输入。