css - mozilla 中的样式不匹配

Question

我有以下代码来设置选择框的样式，它在 chrome 中完美运行，但在 mozilla fire fox 27.0 中运行不正常

 .select-box {
    line-height: inherit;
    width: 150px;
    height:150px;
    font-size: 14px;
    padding: 1px 30px 0px 7px;
    height: 30px;
    margin-left:20px;
    margin-top: 2px;
    background: #fdfffc;
    background: -moz-linear-gradient(top, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fdfffc),   color-stop(85%, #f4f4f4), color-stop(95%, #f4f4f4));
    background: -webkit-linear-gradient(top, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
    background: -o-linear-gradient(top, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
    background: -ms-linear-gradient(top, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
    background: linear-gradient(to bottom, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfffc', endColorstr='#f4f4f4', GradientType=0);
    color: #dddddd;
    text-shadow: 1px 1px 1px #fafafa;
}

JSfiddle:http://jsfiddle.net/mSL87/2/

Answer 1

试试这个 css - mozilla fire fox 28.0

.select-box {
line-height: inherit;
width: 150px;
height:150px;
font-size: 14px;
padding: 3px 2px 2px 7px; /*i have editing in right pading*/
border:1px solid #999;    /*i have edit border */
height: 30px;
margin-left:20px;
margin-top: 2px;
background: #fdfffc;
background: -moz-linear-gradient(top, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fdfffc),   color-stop(85%, #f4f4f4), color-stop(95%, #f4f4f4));
background: -webkit-linear-gradient(top, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
background: -o-linear-gradient(top, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
background: -ms-linear-gradient(top, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
background: linear-gradient(to bottom, #fdfffc 0%, #f4f4f4 85%, #f4f4f4 95%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdfffc', endColorstr='#f4f4f4', GradientType=0);
color: #dddddd;
text-shadow: 1px 1px 1px #fafafa;
}