title: how to register or add-listener for event of div.onresize for major browsers (IE, firefox and google)?
body: <p>how to register or add-listener for event of div.onresize for major browsers (IE, Firefox and chrome)? Onresize event in div tag is not working in Mozilla,Chrome etc. I checked the same code with edit plus software it is working fine.</p>
  
  <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&gt;
  &lt;HTML&gt;
  &lt;HEAD&gt;
  &lt;TITLE&gt; New Document &lt;/TITLE&gt;
  &lt;META NAME="Generator" CONTENT="EditPlus"&gt;
  &lt;META NAME="Author" CONTENT=""&gt;
  &lt;META NAME="Keywords" CONTENT=""&gt;
  &lt;META NAME="Description" CONTENT=""&gt;
  &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      var NumOfRow=1;
      var mainDiv;
      var newButton;
      function AddNewItems() {
          var container = document.getElementById ("msgPanel");
          //var message = "The height with padding: " + container.clientHeight + "px.\n";
          var message = "The height with padding and border: " + container.offsetHeight + "px.\n";
          alert(message);
          NumOfRow++;
          mainDiv =document.getElementById('msgPanel');
          newButton=document.createElement('input');
          newButton.type='button';
          newButton.value='NewButton';
          newButton.id='btn'+NumOfRow;
          mainDiv.appendChild(newButton);
      }
      function getParentDivHeight() {
      alert("entered inside");
          var container = document.getElementById ("msgPanel");
          var message = "The height with padding and border onClick event: " + container.offsetHeight + "px.\n";
          var strheight = container.offsetHeight;
          alert("The DIV height in Pixel is :   " + strheight +"px");
      }
      function RemoveNewItems() {
          if(NumOfRow &gt; 1) {
              var container = document.getElementById ("msgPanel");
              var message = "The height with padding and border onClick event: " + container.offsetHeight + "px.\n";
              alert(message);
              mainDiv.removeChild(newButton);
              alert("button Removed so the DIV height will be decreased");
          } else {
              alert("Please add a Dynamic Button");
          }
      }
  //--&gt;
  &lt;/script&gt;
  &lt;style&gt;
  body{
  font-family:Arial, Helvetica, sans-serif; 
  font-size:13px;
  }
  .info, .success, .warning, .error, .validation {
  border: 1px solid;
  margin: 10px 0px;
  padding:15px 10px 15px 50px;
  background-repeat: no-repeat;
  background-position: 10px center;
  }
  .info {
  color: #00529B;
  background-color: #BDE5F8;
  height: 460px;
  width: 200px;
  background-image: url('info.png');
  }
  .success {
  color: #4F8A10;
  background-color: #DFF2BF;
  background-image:url('success.png');
  }
  .warning {
  color: #9F6000;
  background-color: #FEEFB3;
  background-image: url('warning.png');
  }
  .error {
  color: #D8000C;
  background-color: #FFBABA;
  background-image: url('error.png');
  }
  &lt;/style&gt;
  &lt;/HEAD&gt;
  
  &lt;BODY&gt;
   &lt;div class="info" id="msgPanel" onresize="getParentDivHeight()" &gt;Info message
  
      &lt;div class="success"&gt;Successful operation message&lt;/div&gt;
  
      &lt;div class="warning"&gt;Warning message&lt;/div&gt;
  
      &lt;div class="error"&gt;Error message&lt;/div&gt;
  
      &lt;div id="Container1" &gt;
  
      &lt;/div&gt;
  
  &lt;/div&gt;
  &lt;input type="submit" id="btnSubmit" value="AddButton" onclick="AddNewItems()" /&gt;
  &lt;/br&gt;
  &lt;/br&gt;
  &lt;input type="button" id="btnSubmit1" value="RemoveButton" onclick="RemoveNewItems()" /&gt;
  &lt;/br&gt;
  &lt;/br&gt;
  &lt;input type="button" id="btnSubmit2" value="ShowDIVHeight" onclick="getParentDivHeight()" /&gt;
  &lt;/BODY&gt;
  &lt;/HTML&gt;
  </code></pre>