javascript and css working on firefox but not working on IE

Posted by Nirbhay saini on Stack Overflow See other posts from Stack Overflow or by Nirbhay saini
Published on 2010-04-21T10:34:53Z Indexed on 2010/04/21 11:43 UTC
Read the original article Hit count: 295

Hi I have this code which working on fitrefox but not working on IE missing last charector on IE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>wrapped</title>   
      <script type="text/javascript" language="javascript">  
       function set_padd(){   
        var tt = document.getElementById("span_padding").innerHTML;    
        var txt = new Array();     
     txt = tt.split(" ");                 
        var atxt = '';
        var f_txt = '';
        var wrd_pr_linr = 4;    
        var cnt = 1;     
        for(var i = 0; i < txt.length; i++){ 
          if(txt[i].length > 0){           
           txt[i] = txt[i].replace(' ','');
           if(cnt < wrd_pr_linr){
            if(txt[i].length > 0){
           atxt += ' '+txt[i].replace(' ','');
           cnt++;          
            }
           }else{
            f_txt += '<a class="padd_txt" >'+atxt+'</a><br />';
            atxt = ''; 
            cnt = 1;
           }
          }
        }  
        document.getElementById("span_padding").innerHTML = f_txt;  
       }  
      </script>  
      <style type="text/css">  
       .padd_txt{padding:7px;background:#009;color:#FFF;line-height:26px;font-size:14px;} 

  body{font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; font-size:24px; line-height:1.2em;}
  span{background-color: #009; width:200px; color: #FFF;" class="blocktext;}



      </style>
</head> 
<body onload="set_padd();">
  <div style="width: 350px;"> 
      <p>
      <span id="span_padding">
          This is what I want to 
       happen where one
       long string is wrapped 
       and the text has this 
       highlight color behind 
       it. 
      </span>  
   </div>  
</body>  
</html>

out put on firefox is

This is
I want to
happen where one
string is wrapped
and the text
this highlight
behind it.

and output on IE

This is what
want to happen
one long string
wrapped and the
has this highlight

missing last two word

© Stack Overflow or respective owner

Related posts about css-layout

Related posts about javascript-events