Below is my code.

when open the page in ie browser, then select the text in div, the text will be replaced by some shadow quad blank . If you delete a line z-index:0, in css class test1, the ie will perform correctly.

In my project , the z-index must be set greater than zero, so I couldn't delete the line.

I found a solution is to set bg_img.filter = "" when pannel.z-index greater than 0, then ie will also working good. But unfortunately, the bg_img.filter.alpha must be set, too.

So how could I do?

test .test1 { position:absolute; background:#ffffff; left:20px; top:20px; border:1px solid; width:198px; height:500px; filter: progid:DXImageTransform.Microsoft.Shadow(color="#999999", Direction=135, Strength=5); z-index:0; }

</style>
<script>

function init ()
{
  var pannel = document.createElement ('div');
  var bg_img = document.createElement ('div');
  var head = document.createElement ('div');

  pannel.setAttribute('class', 'test1');
  pannel.setAttribute('className', 'test1');

  bg_img.style.cssText = "position:relative;left:0px;top:0px;"
  + "width:198px;"
  + "height:500px;"
  + "filter:alpha(opacity=100);";

  head.style.cssText = "position:absolute;"
  + "left:0px;"
  + "top:0px;"
  + "width:180px;"
  + "height:20px;";

  document.body.appendChild (pannel);
  pannel.appendChild(bg_img);
  pannel.appendChild(head);

  head.innerHTML = "<div>yusutechasdf</div><div>innerhtml</div>"
}
</script>