How to stop blurry text when using rotation on explorer 8

HTML & CSS
1

Hi I’ve am trying to add my li on the navigate to rotate works fine on new browser but on explorer 8 the text becames blurry does anyone know how I can fix that issue?

here my markup

HTML

<div class="list_1">
<div class="list_1">
    <ul>
       <li><a href="#" class="current">Home</a></li>
        <li><a href="#">Integrated services</a></li>
        <li><a href="#bundle">Bundled services</a></li>
        <li><a href="#">Services</a></li>
        <li><a href="#">Leadership team</a></li>
        <li><a href="#">People</a></li>
        <li><a href="#">News</a></li>
	</ul>
</div>

CSS

.list_1 li {
	top: 10em;
	left: 13em;
	width: 70px;
	height: 30px;
	padding: 10px;
	float:left;
	/*STYLE FOR EXPLORER **/
    -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.93969262, M12=0.34202014, M21=-0.34202014, M22=0.93969262,sizingMethod='auto expand')";
    filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.93969262, M12=0.34202014, M21=-0.34202014, M22=0.93969262,sizingMethod='auto expand');

    -webkit-transform: rotate(-20deg);
	-moz-transform: rotate(-20deg);
	-ms-transform: rotate(-20deg);
	-o-transform: rotate(-20deg);
	transform:rotate(-20deg);

}
2

On my PC, your example looks better in IE8 and it does in FF. I don’t see “blurry”.