Google Chrome中的输入类型搜索border-radius问题

Question

我有一个<input type="search"/>元素（没有其他HTML）。

这是CSS：

input[type=search] {
    border: 1px solid #000;
    padding: 4px 12px;
    border-radius: 8px;
}

在Firefox 7中，它看起来很棒：

但是，在Chrome 15中，圆角被切掉了：

View jsFiddle

我能解决这个问题吗？

Answer 1

您只需添加-webkit-appearance: none即可修复它。

Answer 2

尝试使用-webkit-appearance: textfield;