如何更改组合框下拉按钮的对齐方式？

Question

默认情况下，组合框的下拉按钮位于右侧。 我需要将它放在中心位置。我怎么做？ 是否有可能沿着小部件改变它的x坐标位置？

Answer 1

您可以使用显示图像而非箭头的技巧，background-position-x将其定位在您想要的位置，左侧，右侧甚至中间位置：

＆＃13;

＆＃13;

    select{
        width: 268px;
        padding: 5px;
        font-size: 16px;
        line-height: 1;
        border: 0;
        border-radius: 5px;
        height: 34px;
        padding-left:40px;
        background: url(http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png) no-repeat right #ddd;
        -webkit-appearance: none;
        background-position-x: 14px; // use this to scale
    }

＆＃13;

<select>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>           
</select> 

＆＃13;

＆＃13;

＆＃13;