html - 渲染 Safari

Question

我在 safari 中渲染时遇到问题。

在 firefox、chrome 和 IE 上。如下图所示:

input.searchbox{-webkit-border-radius:10px;-moz-border-radius:10px;background-color:#af5354;border:1px solid #af5354;background-color:#AF5354;border:1px solid #AF5354;border-radius:5px;color:#FFF;float:left;height:19px;margin-left:0.5em;margin-top:1.3em;outline:0px none;padding-left:0.5em;padding-top:0.4em;text-align:left;width:170px;}
input.searchbox:focus{background:#e87476;background:-moz-linear-gradient(top, #e87476 0%, #e87476 20%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #e87476), color-stop(20%, #e87476));outline:0;color:#FFF;}
*::-webkit-input-placeholder{color:#FFF;}
*:-moz-placeholder{color:#FFF;}
*::-moz-placeholder{color:#FFF;}
*:-ms-input-placeholder{color:#FFF;}
input.button{background:url("../../assets/images/sprite.png") -142px -7px;border:none;float:left;height:28px;margin:16px 0px 0px -28px;overflow:hidden;padding:0;width:38px;}
input.button:hover{background:url("../../assets/images/sprite.png") -142px -47px;border:none;float:left;height:28px;margin:16px 0px 0px -28px;overflow:hidden;padding:0;width:38px;}
input[type=search]{-webkit-appearance:none;}

<form id=header-search>
<input class=searchbox placeholder="Search Spout TV">
<input type=submit class=button value=""/>
</form>

有什么方法可以修复它，使其在所有浏览器中都能准确呈现？

Answer 1

添加这个: input.searchbox{border-radius:10px;}