如何在不同的浏览器中控制文本输入的高度和提交输入按钮？ [英] How can I control the height of text inputs and submit input buttons in different browsers?

问题描述

我有一个很少但很难解决的问题。

I have a very little but hard (for me) problem to solve.

我有一个文本输入和一个提交按钮。我需要他们是完全相同的高度，这是真正的跨Chrome和Firefox，理想的互联网浏览器。

I have a text input, and a submit button. I need them to be the exact same height and for this to be true across Chrome and Firefox, ideally internet explorer also.

HTML

<input type="text" name="email" /><input type="submit" value="»" />

CSS

input[type=text] {
    width: 218px;
}

input[type=submit] {
    background: #000;
    color: #fff;
}

input[type=submit], input[type=text] {
    padding: 9px;
    font-size: 18px;
    line-height: 18px;
    float: left;
    border: 0;
    display: block;
    margin: 0;
}

我已经在 jsfiddle这里

I've setup this basic code on a jsfiddle here.

它在chrome中，按钮的高度比文本输入小，在firefox中，它的大小。

You should notice if you load it in chrome, the button is less height than the text input and in firefox, its larger.

我失踪了什么？

推荐答案

c $ c> line-height：18px; 。

Remove/add line-height: 18px; for both.

这篇关于如何在不同的浏览器中控制文本输入的高度和提交输入按钮？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！