CSS - Select 标签在不同浏览器中的高度设置

当使用Select标签时，在不同浏览器中显示的高度不同，如何解决此问题：

解决方法链接：http://stackoverflow.com/questions/20477823/select-html-element-with-height

Demo：http://jsfiddle.net/JSDavi/xzdpp9kf/1

css文件

@media screen and (-webkit-min-device-pixel-ratio:0) {  /*safari and chrome*/

select {

height:30px;

line-height:30px;

background:#f4f4f4;

}

}

select::-moz-focus-inner { /*Remove button padding in FF*/

border: 0;

padding: 0;

}

@-moz-document url-prefix() { /* targets Firefox only */

select {

padding: 15px 0!important;

}

}

@media screen\0 { /* IE Hacks: targets IE 8, 9 and 10 */

select {

height:30px;

line-height:30px;

}

}

针对实际情况，手动调节css中的高度数值。