为什么Firefox在链接<a>和<input type = submit>中显示不同的CSS？

类拿出一个对一个奇怪的问题......为什么Firefox在链接<a>和<input type = submit>中显示不同的CSS？

这里是我的一个按钮CSS：

a.cta-btn-green { 
    color:#fff !important; 
    font-size:14px !important; 
    font-weight:bold; 
    text-shadow: #060 1px 1px 1px; 
    background-color:#329122; 
    padding:5px 10px; 
    -moz-border-radius:14px; 
    -webkit-border-radius:14px; 
    text-decoration:none; 
    float:right; 
    border:0; 
    font-family:Arial, Helvetica, sans-serif; 
    cursor:pointer; 
    background: -moz-linear-gradient(100% 100% 90deg, #307d23, #4ac236); 
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4ac236), to(#307d23)); 
} 


input.cta-btn-green { 
    color:#fff !important; 
    font-size:14px !important; 
    font-weight:bold; 
    text-shadow: #060 1px 1px 1px; 
    background-color:#329122; 
    padding:5px 10px; 
    -moz-border-radius:14px; 
    -webkit-border-radius:14px; 
    text-decoration:none; 
    float:right; 
    border:0; 
    font-family:Arial, Helvetica, sans-serif; 
    cursor:pointer; 
    background: -moz-linear-gradient(100% 100% 90deg, #307d23, #4ac236); 
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4ac236), to(#307d23)); 
}

两个CSS类是相同的，但一个被应用到<a>，另一个是应用于<input type="submit" /> ...效果是，Firefox给出的input.cta-btn-green的高度大于a.cta-btn-green？

任何人都可以告诉我哪里出错了吗？

感谢

来源

2010-11-01 Nasir

字体较高还是整个元素？ – thejh 2010-11-01 12:42:56

整个元素 – Nasir 2010-11-01 12:44:11

如果你告诉你的a和input到display:block那么你将能够设置特定的高度，从而使它们相同。

所以下面的行添加到两个规则：

display:block; 
height:20px; /*adjust this as needed*/

来源

2010-11-01 12:41:55

尝试明确设置每条规则的height和line-height。

来源

2010-11-01 12:40:58

我认为，这是因为你只设置字体高度 - 在<input>元素AFAIK也具有典型的按钮边框其中<a>元素没有按没有。

来源

2010-11-01 12:54:42 thejh

为什么Firefox在链接<a>和<input type = submit>中显示不同的CSS？

回答

相关问题