使用CSS使
我想使<按钮>和<a>看起来一样。我发现了一个类似的帖子,建议添加使用CSS使<button>和<a>看起来一样
box-sizing: content-box;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
但是,在Firefox中查看时,它仍然有轻微的高度差异。这是jsfiddle。任何帮助?
button::-moz-focus-inner,
.btn::-moz-focus-inner
{
border: 0;
padding: 0;
}
此修复中间一个,仍然在最后的输入。
从这里http://www.aheadcreative.com/removing-unwanted-button-padding-in-firefox/
UPDATE
我怀疑你的牺牲品这http://www.cssnewbie.com/input-button-line-height-bug/#.USzRd6Wcmzc
你可以看到线高度的最后一个例子在这个例子中http://jsfiddle.net/H3HK8/24/没有效果,甚至与!重要添加。
在尝试解决这个规则时,我发现了一些让情况变得更加可怕的事情:浏览器定义!重要的规则不能被作者定义的重要规则所超越。这个规则不能被CSS文件,内联样式 - 任何东西否决。
它似乎与[FF重写行高属性](http://www.cssnewbie.com/input-button-line-height-bug/#.USzQkG-KLQc) – 2013-02-26 15:18:21
哈! 40秒对我来说太快了!我正在编辑我的问题,正如你所评论的! – Chris 2013-02-26 15:19:37
您应该确保所有CSS属性都相同。因此,不仅盒大小(它并没有真正做任何事情本身),而且还填充,边距,行高,字体大小,背景等
我认为box-sizing定义了添加边框的方式。 (即填充物的内部或外部)。如果你看看我的jsfiddle例子,按钮和链接都使用相同的样式。我错过了什么吗? – 2013-02-26 15:06:20
不,@OneTrickPony,在Firefox中它们完全不同。 – JakeParis 2013-02-26 14:59:55
Twitter Bootstrap .btn类通过按钮,锚点和输入(type =“submit”)元素来完成此操作。我建议看看他们的代码。 – 2013-02-26 15:15:34