在选择框中垂直对齐的文本 - Firefox的问题

我在Firefox中选择框标题的垂直对齐时出现问题。在选择框中垂直对齐的文本 - Firefox的问题

screen from Firefox

CSS的选择看起来是这样的：

select#cities_list { 
    width: 95px; 
    height: 45px; 
    line-height: 45px; 
    background: url('./img/select-arrow.png') no-repeat right transparent; 
    -webkit-appearance: none; 
    border: 1px solid #dcdcdc; 
    border-left: none; 
    border-right: none; 
    padding: 0 10px; 
    margin: 0; 
    float: left; 
}

在Chrome的一切都看起来不错：

enter image description here

帮助！

来源

2012-08-12 forkie

嗨，你是否解决了这个问题？如果是的话，那么请帮助我.. !! – 2013-03-20 05:51:58

你可以试试这个

padding:.3em;/.4em;

根据您的配置。

来源

2012-10-05 07:24:29 nirupam

这到底是什么？我只是尝试了这一点，它大部分工作。这是什么？ – ClosDesign 2012-11-28 22:24:15

这是什么样的魔法？它只是工作完美... – 2013-08-14 23:05:03

虽然我不知道为什么这个工程...就像一个fyi你也可以这样说：padding：.3em .4em .3em .7em;/0;它似乎工作。 – corymathews 2013-10-25 20:30:18

另一种方法，一个是我愿意的话，是这样的：

@-moz-document url-prefix() { 

    select { 
     padding-top: 8px; 
    } 
}

设置为任何你喜欢的padding-top。仅在Firefox上执行括号内的任何内容。

来源

2014-01-28 22:05:04 Jarrod

这是黑客吗？这会忍受未来的Firefox版本吗？我将padding-top：4px应用于select输入，并解决了问题。看起来，选择按钮确实只在Firefox上改变了它的垂直位置，但是我担心一些未来的浏览器或未经测试的浏览器将不会由于4px的填充顶部而被对齐。你会对此有何评论？提前致谢！ – 2014-07-03 08:48:14

在选择框中垂直对齐的文本 - Firefox的问题

回答

相关问题