Question

我有一个背景图片，当他们'脏'时（我有未保存的更改）我放置在我的表单元素上。该图片使用background-position: right center。

然而，在Safari中，图像显示在黑色三角形下方，当我将鼠标悬停在黑色三角形上时，背景图像（很小）完全被显示的按钮覆盖。

我不确定为什么Safari会将右边三角形按钮内部的空间视为右边框内部空间的一部分，当其他浏览器在左边缘开始右侧时那个按钮MEH。

是否有CSS方法让背景图像显示在下拉箭头/按钮空间的左侧？我在google搜索中注意到，Safari选择元素并没有使用填充语言，所以就这样了。

小提琴：http://jsfiddle.net/jinglesthula/uwKpS/

我在Safari 5.1.7 Win7中看到了这个问题（我无法访问OSX来测试它是否存在问题）。

Answer 1

我知道这是一个老问题，但我现在遇到了同样的问题，我通过重置safari中的外观以及css中的其他网络浏览器来修复它，这是我的解决方案，希望这会有所帮助。

select { 
    /* and then whatever styles you want*/
    background: url(http://farm3.staticflickr.com/2166/2098205368_3e3f6090ac_t.jpg) no-repeat right #fff;
    /* reset the appearances*/
    -moz-appearance: none; 
    -webkit-appearance: none; 
    appearance: none;
    /* and then whatever styles you want*/

    width: 100px;
    padding: 5px;
}

Safari选择箭头所涵盖的背景图像

1 个答案: