Css 在 Chrome 或 Firefox 中不工作，但在 IE 中工作答案

【问题标题】：Css not working in Chrome or Firefox but works in IECss 在 Chrome 或 Firefox 中不工作，但在 IE 中工作
【发布时间】：2017-06-07 20:09:40
【问题描述】：

我的 ASP.net 网站上有一个按钮：

<div class="input-control">
    <input type="button" id="btnInvite" value="Invite" name="Invite" class="btn" />
</div>

我的 CSS 是：

.btn {
border-style: none;
border-color: inherit;
width: 100%;
height: 35px;
background-color: green;
overflow:auto;
}

这在 IE 中可以正常工作，但在 Chrome 或 Firefox 中无法正常工作，按钮不会显示为绿色只是灰色，这是为什么呢？

【问题讨论】：

【解决方案1】：

这可能是因为您忘记了border-width 值。我假设 IE 默认会自动添加 border-width: 1px;，而 Chrome 和 Firefox 不会。

将此添加到您当前的代码中：

.btn {
border: 1px solid inherit;
}

这应该是结果：

.btn {
border: 1px solid inherit;
width: 100%;
height: 35px;
background-color: green;
overflow:auto;
}

<div class="input-control">
    <input type="button" id="btnInvite" value="Invite" name="Invite" class="btn" />
</div>

【讨论】：

我并不是说您的随机猜测是错误的，但是您怎么知道 OP 不希望像问题所示那样应用 CSS？除非 OP 声明任何不同，否则我假设问题是显示的 CSS not 按预期在 Chrome 中应用。 OP 没有提到任何关于想要边框的事情。
@Fran 没错，但 OP 并没有真正定义问题所在，只是试图通过说出我认为是问题的答案来提供帮助。
发布一个你知道问题所在的答案吗？
对不起，我更新了这个问题，在 Chrome 和 Firefox 中按钮不显示为绿色，只是灰色。
可以发图片吗？