样式<select>角落为webkit </select>

Question

我要做的是使用“border-radius”圆角<select>。奇怪的是，webkit浏览器显示白色背景溢出<select>的边界。

更新 这是屏幕截图和我的代码：

HTML：

<select class="rounded_select">
   <option>rounded_select</option>
</select>

CSS：

.rounded_select {
     border-top: 2px solid #ccc;
     border-left: 2px solid #ccc;
     border-bottom: 2px solid #eee;
     border-right: 2px solid #eee;
     border-radius: 10px;
}

有任何想法如何修复它？

更新：最好将按钮图像保存在选择的右侧。

Answer 1

-webkit-appearance:none可能会做到这一点。

编辑：似乎是这样做的：http://jsfiddle.net/dbxjB/

Answer 2

为background-color设置select似乎可以解决问题。

编辑：不。将边框设置为1px就可以了。以及2px虚线为例。出问题。