最复杂的CSS渲染错误(IE9)

时间:2011-09-17 22:59:09

标签: css rendering internet-explorer-9

在IE9中看一下这个:

http://jsfiddle.net/dalgard/n6PDB/show/

屏幕转储: enter image description here

阅读这些评论:

/*
 *  IE9: Upon moving the mouse a ghostly 1px vertical line appears 53px into the
 *  blue area - only works with normalized CSS (!?) and not inside an iframe
 */

#test {
  width: 152px;             /* must be 152px or larger! */
  height: 200px;            /* can be any height */
  border-radius: 1px;       /* must be 1px or larger */
  background-color: #44f;   /* ghost-line becomes invisible with #00f */
}

#test:hover {}              /* removing this makes the line disappear */

#test div {
  opacity: 0;               /* removing this makes the line disappear */
  position: relative;       /* removing this makes the line disappear */
  left: 53px;               /* must be 53px or smaller! */
  width: 10px;              /* must be 1px or larger */
  height: 150px;            /* height of the ghost-line */
}

有没有人对此有任何意见?发生了什么,我该如何举报?我如何防止这种情况发生(我知道,似乎我可以改变上面的任何属性,但这不是那么容易......)?

2 个答案:

答案 0 :(得分:1)

该行与父容器和内部div的边界有关。如果你摆脱内部div或边界,它解决了问题。我不知道这是否会有所帮助,但这似乎是问题所在。

答案 1 :(得分:0)

我可以在IE9上看到这个问题 版本:9.0.4(KB2618444

但它似乎已修复 版本:9.0.24(KB2909921