IE8中的CSS精灵按钮不显示/工作?

时间:2011-05-04 15:56:34

标签: css css-sprites

我遇到了ie8和简单表单提交按钮的问题。我使用图像作为一个带有一点CSS的按钮,因此它有一个很好的悬停效果。但它在IE8中不起作用/显示。

btnSubmit.png具有默认和悬停状态。

这是我的代码

<input name="form_submit" id="form_submit" 
    class="btns btnFormsubmit" type="submit"  />

和CSS

.btns {
    background-color:transparent;
    background-position:left bottom;
    background-repeat:no-repeat;
    border:0 none;
    display:block;
    height:31px;
    text-indent:-3999em;
    }
.btns:hover {
    background-position:left top;
    cursor:pointer;
}

.btnFormsubmit {
    background-image:url(imgs/btnSubimt.png);
    height: 31px;
    width:267px !important;
}

我还尝试添加href="#"

<input href="#" name="form_submit" id="form_submit" 
    class="btns btnFormsubmit" type="submit"  />

2 个答案:

答案 0 :(得分:1)

IE8不支持输入:在怪癖模式下悬停css选择器。尝试添加doctype声明(例如<!DOCTYPE html>),它应该没问题。

答案 1 :(得分:0)

很难在不同的浏览器中输入一致的输入。如果您无法使用<button type="submit"></button>,我建议使用{{1}}(如果doctype不是之前建议的问题)。