定义表单select高度后,文字上下没居中的解决方法
2012-5-16 8:23 Wednesday  

分类: CSS 标签: 内容 select 高度 padding 上下 评论(50) 浏览(29346)

定义表单select高度后,文字上下没居中的解决方法。

如果一个select高度设为20px;则它和其它的input的结果不一样,它的实际组成为上下边框各1px,内容18px,而不是内容20px,边框不算在高度以内。

另外,当对select使用padding后,你会发现,此时内容的高度不是保持不变,而是在height的基础上减去上下padding,而不是其他input那样,如果设置高度了,再设置padding,则实际内容的高度为设置的高度加上上面padding。

所以要解决一个设置select高度22px的select内容上下居中的问题,使用padding: 1px 0;即可。

 

 

select边框border:medium none;

 

 

 

+1 12

留下你的看法: