尽管CSS是一样的，但火狐的搜索框更高了

Search box is taller in Firefox despite CSS being the same

本文关键字：搜索 火狐 尽管 一样 CSS      更新时间：2023-09-26

我刚刚在Firefox中发现了一个问题，其中类型为search的输入元素以相同的css样式显示不同。代码如下:

<input style="height:29px;" type="search">
<input style="height:29px;" type="submit" value="search">

在Webkit浏览器如Chrome, Safari和Opera上没有问题，但在最新版本的Firefox上它的行为不同。搜索框变高了。如何用CSS或JavaScript解决这个问题?

是否可以尝试在CSS中添加以下元素?

CSS

input::-moz-focus-inner {
    height:29px;
    border: 0; 
    padding: 0; 
    margin-top:-2px; 
    margin-bottom: -2px;
}


<input type="search">
<input type="submit" value="search">

jsfiddle: http://jsfiddle.net/w2mmX/1/

应该可以解决这个问题。

相关文章：