[英]Input (submit) element occupies extra space in Firefox
包含链接,输入(提交)和跨度的网页。 所有样式都具有相同的外观,实际上输入的样式也与超链接和跨度具有相同的外观。
经过测试使用:Firefox 3.0、3.6、4.0、14.0.1
由于某些原因,其他输入会稍大。 另外,输入的文本与链接和跨度的文本不对齐。 这是现场演示。
这是我的CSS:
a{
text-decoration:none;
}
input[type="submit"]{
border:0 none;
background:transparent;
}
a, input[type="submit"], span{
border:solid 1px green;
font-size:64px;
font-family:Arial;
font-weight:bold;
float:left;
padding:0;
margin:0;
}
标记:
<a href="#">LINK</a>
<input type="submit" value="INPUT" />
<span>SPAN</span>
那么,如何使输入看起来像普通的链接或跨度? 这是一种奇怪的浏览器行为,还是我只是错过了一些CSS? 我已经解决了这一天了。
编辑
看来问题只发生在Firefox中。 IE8-9和Chrome可以正确显示它。
通过在CSS中使用input::-moz-focus-inner
来删除Firefox中的按钮填充:
input::-moz-focus-inner /*Remove button padding in FF*/
{
border: 0;
padding: 0;
}
编辑:用以上代码更新了演示链接。
在Firefox中查看演示
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.