Firefox边框半径渲染奇怪的宽效果

我在Firefox中使用border-radius时有一些奇怪的副作用。打开以下html会在一些按钮边框上呈现一些三角形。见一面effetcs这里：http://i.imgur.com/GyqiEL8.png（我没有对图像足够的声誉）Firefox边框半径渲染奇怪的宽效果

代码

<html> 
    <head> 
    </head> 
    <body> 
     <form> 
      <input style="border-radius: 10px;" value="Continue" type="submit"> 
     </form> 
    </body> 
</html>

人有什么想法？我使用FF 28.0 感谢

来源

2014-04-30 user1912184

我认为我们需要看到一个带有完整CSS的JSfiddle，因为我怀疑你有一些可能影响它的其他属性。 –

@Paulie_D：不确定jsfiddle是什么，但这是html的样子，它显示了副作用。 – user1912184

这是工作的所有浏览器：

CSS

.myButton { 
    width: 180px; 
    height: 48px; 
    padding: 0; 
    -webkit-box-sizing: content-box; 
    -moz-box-sizing: content-box; 
    box-sizing: content-box; 
    color: rgba(0,0,0,1); 
    font: normal 11px/48px "Lucida Grande"; 
    border: 1px solid rgba(128,128,128,1); 
    -webkit-border-radius: 67px; 
    -moz-border-radius: 67px; 
    border-radius: 67px; 
    background-image: rgba(235,235,235,1); 
    background-image: -webkit-linear-gradient(top, #dbdbdb 0%,#d6d6d6 100%); 
    background-image: -moz-linear-gradient(top, #dbdbdb 0%,#d6d6d6 100%); 
    background-image: -o-linear-gradient(top, #dbdbdb 0%,#d6d6d6 100%); 
    background-image: -ms-linear-gradient(top, #dbdbdb 0%,#d6d6d6 100%); 
    background-image: linear-gradient(top, #dbdbdb 0%,#d6d6d6 100%); 
    -webkit-box-shadow: rgba(128,128,128,1) 0px 0px 0px 0px, inset rgba(255,255,255,1) 0px 0px 0px 0px; 
    -moz-box-shadow: rgba(128,128,128,1) 0px 0px 0px 0px, inset rgba(255,255,255,1) 0px 0px 0px 0px; 
    box-shadow: rgba(128,128,128,1) 0px 0px 0px 0px, inset rgba(255,255,255,1) 0px 0px 0px 0px; 
}

HTML

<button type="button" class="myButton">Button</button>

来源

2014-04-30 10:41:45 Cosmos

可以肯定它是一个浏览器的问题。尝试更新或尝试执行这些问题排查步骤：https://support.mozilla.org/en-US/kb/websites-look-wrong-or-appear-differently

来源

2014-04-30 10:54:25 RichardN

尽管此链接可能会回答问题，但建议将链接中的重要部分复制到答案中，因为链接可能变为非活动状态。 –

Firefox的某些主题/外观可以更改表单元素（包括按钮）的默认行为。这可能是潜在原因之一。可以通过以下方式解决：

-moz-appearance: none; 
-webkit-appearance: none;

来源

2014-04-30 13:10:45 srdjans

Firefox边框半径渲染奇怪的宽效果

回答

相关问题