html - Safari 中的输入字段未对齐

Question

我试图让这两个输入直接相互内联。以下是我希望它们在 Chrome 中的样子以及它们在 Chrome 中的样子:

http://i.gyazo.com/40d8dc64a6875ff2bf2de58ee6008610.png

然而，这是它们在 Safari 中的样子:

http://i.gyazo.com/7b832fcb5e99057b60151182fbc4b21a.png

由于某种原因，它们在高度上大约偏移了 1 或 2 像素。

这是我的 HTML:

<input type="text" name="email" placeholder="Email Address" /><input type="button" name="button" value="Sign-Up">

这是我的 CSS:

input[type="text"] {
    width: 200px;
    height: 30px;
    padding: 10px 20px;
    color: #555459;
    font-size: 18px;
    border: 0;
}

input[type="button"] {
    font: normal;
    margin: 0;
    font-size: 18px;
    padding: 10px 20px;
    cursor: pointer;
    border: 0;
    height: 50px;
}

不知道为什么它在 Safari 中有一个像素偏移，感谢所有帮助!

Answer 1

尝试将 text 的高度更改为 50px