Question

例如，当您将鼠标悬停在图标上时，光标应更改为不同。它的工作原理除了IE 8.在IE 8上，这些图标变得不可用，即不仅光标没有改变，而且Jquery点击事件也不会触发。考虑以下html代码如何在FF，IE7以及最终在IE8中运行：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>CSS IE 8 cursor test</title>
     <style type="text/css" media="screen">
        .icon-button {
            float: left; 
            cursor: pointer;
        }
        .ui-icon { width: 15px; height: 10px; background-image: url(http://sstatic.net/so/img/replies-off.png); }
 </style>
</head>
<body>
   <div class="icon-button ui-icon"></div>
   <div>Sample Text</div> 
</body>
</html>

什么是迁移是问题的根源？什么可能是workarrounds？
提前谢谢。

P.S。改变DOCTYPE是不可能的。
此外，如果我在此示例中删除 float：left ，它似乎“固定”，但当我在网站上删除它时，除了破坏的设计，它也没有帮助。

Answer 1

IE8不喜欢空div。在div中放置一个带透明像素的空白<img/>似乎可以修复它。

演示：http://jsbin.com/asiju（可通过http://jsbin.com/asiju/edit进行编辑）

HTML来源：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>CSS IE 8 cursor test</title>
    <style type="text/css" media="screen">
      .icon-button { float: left; cursor: pointer; }
      .ui-icon { width: 15px; height: 10px; background-image: url(http://sstatic.net/so/img/replies-off.png); }
      .dummy-image { width: 15px; height: 10px; vertical-align: top; border: none; }
    </style>
  </head>
  <body>
    <div class="icon-button ui-icon"><img class="dummy-image" src="data:image/gif;base64,R0lGODlhAQABAJH/AP///wAAAMDAwAAAACH5BAEAAAIALAAAAAABAAEAQAICVAEAOw=="/></div>
    <div>Sample Text</div>
  </body>
</html>

Answer 2

我不知道有什么黑客可以击败它。但是，如果可以点击smth，则应该在a标记中，因此请插入a和display:block。 href可以是=#。这个解决方案似乎是语义的，对我有好处:)

Answer 3

怎么样：

<a href="whatever.php">
<div class="BG IMAGE" style="cursor:The one you want"></div>
</a>

我自己使用它并且工作正常。

Answer 4

取出float:left，css类如下所示。

.icon-button { cursor: pointer; }

它应该有用。

Answer 5

这在IE8中对我有用，超级简单

cursor: pointer !important;

IE 8 div和css游标

5 个答案: