html - IE < 9 のテーブル行の不透明度?

Question

不透明度を設定しようとしています (そして後で JavaScript で変更しようとしています)。しかし、私はそれを機能させることはできません。私のHTMLは：

<div class="table" >
  <div class="row" >
    <span>col1 test</span><span>col2</span><span>col3</span>
  </div>
  <div class="row" >
    <span>col1</span><span>col2 test</span><span>col3</span>
  </div>
  <div class="row" >
    <span>col1</span><span>col2</span><span>col3 test</span>
  </div>
</div>

私のCSS：

.table {display:table;}
.row {display:table-row;

      -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
        filter: alpha(opacity=20);
        -moz-opacity:0.2;
        -khtml-opacity: 0.2;
        opacity: 0.2;
}
.row span {display:table-cell;padding: 5px;}

OR jsfiddle AND codepen (ただし、IE8 または IE7 ではクラッシュするようです)

IE8 と IE7 でテストするために、ブラウザー モードを IE9 の dev tolls から変更しています。(同じことをしている場合は、ブラウザ モードとドキュメント モードが同じであることを確認してください)。

はい、「セル」に不透明度を適用すると機能します（ただし、行には必要です）

誰かが何か問題を抱えていますか？

編集：これはjsbinです

解決策はありますか？