Html 为什么输入按钮是'；大小与css样式不同？

我正在macOS上开发一个电子应用程序

在CSS文件中，我将输入大小指定为21px高度

CSS

HTML

但在应用程序中，按钮的高度似乎是18像素

我签入了开发工具。元素大小如下所示

为什么输入按钮的大小与CSS文件中指定的高度不同。这是因为我指定的“保证金底部”属性吗

更新：

我试图添加

！重要信息

标记无效

检查CSS文件，任何地方都没有指定18px

输入按钮大小是否有其他可能受到其他CSS属性（例如float）的影响/覆盖

更新2：

我在Windows系统上试用了这个应用程序，按钮的大小正好是21px

---

这个问题似乎是macOS指定的问题。

您的代码完美地设置了所有主要浏览器的高度

可能CSS框架会覆盖默认样式。尝试添加

！重要信息

高度属性后面的标记，如：

高度：21px！重要的请注意，这不是最佳实践

如果您需要进一步帮助，请告诉我们您是否使用CSS框架（可能一些JS代码也可以覆盖它）以及您使用的浏览器。
您的代码完美地设置了所有主要浏览器的高度

可能CSS框架会覆盖默认样式。尝试添加
！重要信息
高度属性后面的标记，如：
高度：21px！重要的请注意，这不是最佳实践

如果您需要进一步的帮助，请告诉我们您是否使用CSS框架（可能一些JS代码也可以覆盖它）以及您正在使用的浏览器。
检查它是否被指定为18px的任何其他高度覆盖。正如人们建议使用“！important”一样，尽量避免使用它。尝试使用css选择器。使其更具体到您的输入字段。
检查它是否被指定为18px的任何其他高度覆盖。正如人们建议使用“！important”一样，尽量避免使用它。尝试使用css选择器。使其更具体到您的输入字段。
尝试添加！重要的标签，以您的身高作为测试。它是否如预期的那样显示？如果是这样的话，您已经有了另一种样式覆盖了您在某个地方所期望的样式。使用行高而不是标题应该可以，尝试在css中使用id名称。尝试添加！重要的标签，以您的身高作为测试。它是否如预期的那样显示？如果是这样的话，那么您就有了另一种样式覆盖了您在某个地方所期望的样式。请使用行高而不是标题。如果可以，请尝试在css中使用id名称。
input {
    float: left;
    margin-bottom: 10px;
    height: 21px;
}

<input type="button" value="Choose a file" id="fileInput">
<br style = "clear:left">