title: ScrollIntoView For Table Row Not Working in IE 8
body: <p>Can someone please explain why the following does not work in IE8. Basically i'm just trying to scroll a Table Row into view contained within an overflow DIV.
  Code:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
  &lt;html&gt;
  &lt;head&gt;  
  &lt;script language="javascript" src='scripts/jquery-1.3.2.js'&gt;&lt;/script&gt;
  &lt;script language="javascript" src='scripts/jquery.scrollTo-1.4.2.js'&gt;&lt;/script&gt;      
  &lt;stylesheet type="text/css"&gt;
      table {border-collapse: collapse;}
      th, td {margin: 0; padding: 0.25em 0.5em;}
  
      html, body 
      {
          height: 100%;
          width:100%;
          overflow:hidden;
      }
  
      body  
      {
          height:100%;
          overflow:hidden;
      } 
  
      #scrollpanel
      {
          height:100px;
          overflow-x:hidden;
          overflow-y:scroll;
          width:200px
      }
  
  &lt;/style&gt;
    &lt;script&gt;
      $(document).ready(function()
      {       
          var scrollToDiv = document.getElementById("scrollToDiv");
          scrollToDiv.scrollIntoView(true); // Works
  
          var scrollToRow = document.getElementById('scrollToRow');
          scrollToRow.scrollIntoView(true); // Wont Work in IE8
  
          //$.scrollTo("#scrollToRow"); // Using JQuery Scroll To Lib doesn't work
          //location.hash = 'scrollToAnchor'; // this work
      });
  
  &lt;/script
   &lt;/head&gt;
   &lt;body&gt; 
      &lt;div id="scrollpanel"&gt;
      &lt;div&gt;...&lt;/div&gt;
      &lt;div&gt;...&lt;/div&gt;
      &lt;div&gt;...&lt;/div&gt;
      &lt;div&gt;...&lt;/div&gt;
      &lt;div&gt;...&lt;/div&gt;
      &lt;div&gt;...&lt;/div&gt;
      &lt;div&gt;...&lt;/div&gt;
      &lt;div&gt;...&lt;/div&gt;
      &lt;div id="scrollToDiv"&gt;Scroll Here&lt;/div&gt;
  &lt;/div&gt;
  &lt;br&gt;
  &lt;div id="scrollpanel"&gt;
      &lt;table id="tblRI"/&gt;
          &lt;tbody id="tbody1"&gt;
              &lt;tr id="tr1"&gt;
                  &lt;td&gt;Data&lt;/td&gt;
                  &lt;td&gt;Data&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr id="tr2"&gt;
                  &lt;td&gt;Data&lt;/td&gt;
                  &lt;td&gt;Data&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr id="tr3"&gt;
                  &lt;td&gt;Data&lt;/td&gt;
                  &lt;td&gt;Data&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr id="tr4"&gt;
                  &lt;td&gt;Data&lt;/td&gt;
                  &lt;td&gt;Data&lt;/td&gt;
              &lt;/tr&gt;
              &lt;tr id="scrollToRow"&gt;
                  &lt;td&gt;&lt;A NAME="scrollToAnchor"&gt;ScrollHere&lt;/A&gt;&lt;/td&gt;
                  &lt;td&gt;Data 02-02&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;
    &lt;body&gt;
   &lt;/html&gt;
  </code></pre>
  
  <p>Well it seems ScrollIntoView doesn't work for Table Row elements. If I change to use a Column selector instead it works fine.</p>
  
  <pre><code>&lt;tr id="scrollToRow"&gt;
     &lt;td id="tdScrollToColumn"&gt;&lt;A NAME="scrollToAnchor"&gt;ScrollHere&lt;/A&gt;&lt;/td&gt;
     &lt;td&gt;Data 02-02&lt;/td&gt;
  &lt;/tr&gt;
  
  $(document).ready(function()
  {       
    var scrollToDiv = document.getElementById("scrollToDiv");
    scrollToDiv.scrollIntoView(true); // Works
  
    var scrollToRow = document.getElementById('scrollToColumn');
    scrollToRow.scrollIntoView(true); // Works in IE8
  
    //$.scrollTo("#scrollToRow"); // Using JQuery Scroll To Lib doesn't work
    //location.hash = 'scrollToAnchor'; // this work
   });
  </code></pre>