CSS:删除select元素内的填充 [英] CSS: Remove padding within select element

问题描述

我正在尝试从select元素中删除填充，以使其中的文本与直接位于其下方的input元素中的文本对齐.

I'm trying to remove padding from within a select element so that the text within it lines up with the text in the input element directly below it.

除其他外，我还尝试了以下方法.

I've tried the below amongst other things.

select{
    padding-left:0;
    }

有什么想法吗?

JSfiddle在这里 http://jsfiddle.net/pLSkH/2/

JSfiddle here http://jsfiddle.net/pLSkH/2/

推荐答案

从选择的CSS中删除text-indent: 3px;

remove the text-indent: 3px; from select css

input, select {
    float: right;
    width: 50%;
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    box-sizing: border-box;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    font-family: Calibri;
    font-size: 12px;
}

http://jsfiddle.net/pLSkH/4/

text-indent: 3px;引起相对于左侧的水平间距，因此它看起来像一个padding

text-indent: 3px;causing horizontal spacing with respect to the left, so its seems like a padding

这篇关于CSS:删除select元素内的填充的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！