più sofisticate di rendering CSS bug di tutti i tempi (IE9)

Question

Date un'occhiata a questo in IE9: discarica

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

schermo:

Leggere questi commenti:

/* 
* 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 */ 
} 

Qualcuno ha qualche opinione su questo? Cosa sta succedendo e come posso segnalarlo? Come faccio a evitare che ciò accada (lo so, sembra che potrei solo cambiare QUALUNQUE degli attributi in quanto sopra, tuttavia non è così facile ...)?

Answer 1

la linea ha a che fare con il bordo del contenitore genitore E il div interno. Se ti sbarazzi del div interno o del confine, risolve il problema. Non so se questo aiuterà ma è quello che sembra essere il problema.

Answer 2

posso vedere il problema su IE9 Versione: 9.0.4 (KB2618444)

ma sembra essere fissato su Versione: 9.0.24 (KB2909921)