兼容Ie firefox，解决文字溢出的问题

 

在处理MIS 中的Event list时，ToUser有的总是很长，结果把表格都撑开了造成页面都变形了。
后来增加了样式: word-wrap:break-word;word-break:break-all， 但只能在IE里生效。

今天终于找到了一个方法可以兼顾IE及Firefox，现列在下面：
<style type="text/css">
.wordwrap
{
     word-wrap:break-word;
     word-break:break-all;
    -moz-binding: url('./wordwrap.xml#wordwrap');
     overflow: hidden;
}
</style>



当然，在调用前你首先要给你那容器一个宽度值，例如<div style="width:100px" class="wordwrap">需要换行的内容</div>


其中里面有个wordwrap.xml，这个文件的内容如下：

程序代码

<?xml version = "1.0"?>

<bindings xmlns = " http://www.mozilla.org/xbl " xmlns:html = " http://www.w3.org/1999/xhtml ">

<binding id = "wordwrap" applyauthorstyles = "false">

     <implementation>
         <constructor>
             //<![CDATA[
            
             var elem = this;

             elem.addEventListener('overflow',
                 function()
                 {
                     var exp = /<?//*[?_/s="'/w]+>/g;
                    
                     var txt = elem.innerHTML;
                     var chars = txt.split('');
                     var newTxt = chars.join('?');                    
                     newTxt = newTxt.replace(exp, reconstructTag);                    
                     elem.innerHTML = newTxt;
                 },false);
                
                 function reconstructTag(_tag)
                 {
                     return _tag.replace(/?/g, '');
                 }

             //]]>
         </constructor>
     </implementation>
</binding>

</bindings>