IE9 Bug with transformation

Testing a bug with IE 9 rotation transformation

by sebastianauer

HTML

<div id="widget-node-265" class="vud-widget vud-widget-nicole">
      <div class="nicole-votes-display">0</div>
      <a class="vud-link-up ctools-use-ajax ctools-use-ajax-processed" rel="nofollow" href="#">
           <div title="Vote for this style!" class="up-inactive"></div>
           <div class="element-invisible">Vote for this style!</div>
       </a>
</div>

CSS

.vud-widget-nicole {
    /* float: left; */
    float: right;
    background: #F0EFF1;
    margin: 10px 20px 10px 0;
    padding: 8px;
    width: 125px;
    height: 100px;
    -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
    -webkit-box-shadow: -1px 2px 4px grey; -moz-box-shadow: -1px 2px 4px grey; box-shadow: -1px 2px 4px grey;
    
}
.vud-widget-nicole .up-active, .vud-widget-nicole .up-inactive {height: 60px; width: 125px; margin-top: 1px;}
.vud-widget-nicole a {background-color: #F0EFF1;}

.vud-widget-nicole .up-active {
/* Already Voted*/
       background: #F0EFF1 url(http://img405.imageshack.us/img405/1240/lookbookvotesprite.gif) no-repeat;
       background-position: 0 -90px}

.vud-widget-nicole .up-inactive {
/* Not voted yet */
       background: #F0EFF1 url(http://img405.imageshack.us/img405/1240/lookbookvotesprite.gif) no-repeat top left;
   }

.vud-widget-nicole .up-inactive:hover {
  -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); filter: progid:DXImageTransform.Microsoft.Matrix(/* IE6–IE9 */ M11=0.9986295347545738, M12=0.05233595624294383, M21=-0.05233595624294383, M22=0.9986295347545738, sizingMethod='auto expand'); zoom: 1;
}



.vud-widget-nicole .up-active {
    cursor: default;
}
.vud-widget-nicole .up-inactive:hover {
    cursor: pointer;
}

.vud-widget-nicole .nicole-votes-display {
    font-family: Helvetica, Verdana, Arial, sans-serif;
    font-weight: bold;
    text-align: center;
    height: 26px;
    font-size: 20px;
    margin: 0px 5px;
    padding: 2px;
}

.vud-widget-nicole .ctools-ajaxing {
  padding-right: 0 !important;
  display: block;
  width: 50px;
  height: 22px;
  background-position: center;
  float: left;
}

.vud-widget-nicole .ctools-ajaxing div {
  display: none;
}

/**
 * Hide elements visually, but keep them available for screen-readers.
 *
 * Used for information required for screen-reader...